AJAX Auto Scroll Down functie
Het AJAX gedeelte:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<script type="text/javascript">
function showData(str)
{
if (str=="")
{
document.getElementById("monitorData").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("monitorData").innerHTML=xmlhttp.responseText;
var objDiv = document.getElementById("monitorData");
objDiv.scrollTop = objDiv.scrollHeight;
}
}
xmlhttp.open("GET","monitorgetdata.php?q="+str,true);
xmlhttp.send();
setTimeout("showData()", 5000);
}
</script>
function showData(str)
{
if (str=="")
{
document.getElementById("monitorData").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("monitorData").innerHTML=xmlhttp.responseText;
var objDiv = document.getElementById("monitorData");
objDiv.scrollTop = objDiv.scrollHeight;
}
}
xmlhttp.open("GET","monitorgetdata.php?q="+str,true);
xmlhttp.send();
setTimeout("showData()", 5000);
}
</script>
Plaats van output:
Code (php)
1
2
3
2
3
<div id="content">
<p id="monitorData"> </p>
</div>
<p id="monitorData"> </p>
</div>
Gewijzigd op 16/10/2010 12:16:20 door Harry Hartman
Dit zorgt ervoor monitorData vervangen wordt door hetgene dat hij ophaalt.
Als je de nieuwe data bovenaan wilt hebben staan, dan moet je de oude data erachter zetten.
document.getElementById("monitorData").innerHTML=xmlhttp.responseText + document.getElementById("monitorData").innerHTML;
Bedankt Daan, opgelost!
Gewijzigd op 16/10/2010 20:21:54 door Harry Hartman
Und waarom gebruik je geen Mootools of Jquery dat zou vééél sneller typ werk voor je zijn + je hebt nog allerlei andere functies dat je later zou (kunnen) gebruiken.