Ajax Refresher für XMLhttprequest

Question

Ich möchte das XML-Dokument in einem festen Intervall gelesen werden, und vermeiden Sie vollständige Seitenaktualisierung jedes Mal, wenn es nach Updates sucht. Der Code, der auskommentiert ist, funktioniert, aber verwirft den JQuery-Zyklus. (basierend auf http://buildinternet.com/project/totem/) Brauchen Sie etwas Hilfe mit diesem.

//function refresh() 
// { 

var xhttp = new XMLHttpRequest(); 

xhttp.onreadystatechange = function() { 
    if (this.readyState == 4 && this.status == 200) { 
     myFunction(this); 
    } 
}; 

xhttp.open("GET", "drift.xml", true); 
xhttp.send(); 

// } 
function myFunction(xml) { 
    var xmlDoc = xml.responseXML; 
     var item = xmlDoc.getElementsByTagName("item"); 
     var itemlength = item.length; 
     var i; 
     var html=''; 
     var today = new Date(); 

     var aktuella = []; 
     $("#wrapper").append('<ul id=\'wrap\'></ul>'); 

     for (i = 0; i < itemlength; i++) { 
     var postDate = xmlDoc.getElementsByTagName("expires")[i].childNodes[0].nodeValue; 
     var date = postDate.substring(8, 10); 
     var month = postDate.substring(5, 7); 
     var year = postDate.substring(0, 4); 
     var expiredDate = new Date(year, month - 1, date); 

     if (expiredDate > testDate) { 
     aktuella.push(i); 
     } 
    }; 

    if (aktuella.length == 0) { 
     var none = "<p>Info</p>"; 
     $('#wrapper').prepend(none); 
    }; 

    if (aktuella.length == 1) { 
     var expires = '<p>' + xmlDoc.getElementsByTagName("expires")[0].parentNode.childNodes[1].textContent + '</p>'; 
     $('#wrapper').prepend(expires); 
    }; 

    if (aktuella.length > 1) { 
     for (i = 0; i < aktuella.length; i++) { 
     var expires = '<li id="' + i + '">' + xmlDoc.getElementsByTagName("expires")[i].parentNode.childNodes[1].textContent + ' - Se Driftinfo</li>'; 
     $('#wrap').prepend(expires); 
     }; 
    }; 


    $(function(){ 
     $('#wrap').totemticker({ 
      row_height : '120px', 
      next  : '#ticker-next', 
      previous : '#ticker-previous', 
      stop  : null, 
      start  : null, 
      mousestop : true, 
      }); 
     }); 
    } 

    // refresh(); 
    // setInterval("refresh()", 5000); 
    </script> 

Answer 1

Ganz einfach: Fügen Sie dieses Skript Ti:

setInterval(function(){ 
var xhttp = new XMLHttpRequest(); 

xhttp.onreadystatechange = function() { 
if (this.readyState == 4 && this.status == 200) { 
    myFunction(this); 
} 
}; 
}, milliseconds); 

Answer 2

versuchen jetzt mit diesem. Da war ein Fehler. funtion stattdessen Funktion und das Intervall nach der Funktion aufzurufen

function myFunction(xml) { 
var xmlDoc = xml.responseXML; 
    var item = xmlDoc.getElementsByTagName("item"); 
    var itemlength = item.length; 
    var i; 
    var html=''; 
    var today = new Date(); 

    var aktuella = []; 
    $("#wrapper").append('<ul id=\'wrap\'></ul>'); 

    for (i = 0; i < itemlength; i++) { 
    var postDate = xmlDoc.getElementsByTagName("expires") [i].childNodes[0].nodeValue; 
    var date = postDate.substring(8, 10); 
    var month = postDate.substring(5, 7); 
    var year = postDate.substring(0, 4); 
    var expiredDate = new Date(year, month - 1, date); 

    if (expiredDate > testDate) { 
    aktuella.push(i); 
    } 
}; 

setInterval(function(){ 
var xhttp = new XMLHttpRequest(); 

xhttp.onreadystatechange = function() { 
if (this.readyState == 4 && this.status == 200) { 
myFunction(this); 
} 
}; 
xhttp.open("GET", "drift.xml", true); 
xhttp.send(); 
}, milliseconds); 

Answer 3

Hier ist die Website ohne jeden Versuch, die Ajax zu aktualisieren:

http://socialsiberia.com/dash/test1.html

Und hier ist das seltsame Verhalten, das auftritt, wenn ich hinzufügen der folgende Code:

http://socialsiberia.com/dash/test2.html

setInterval(function(){ 
var xhttp = new XMLHttpRequest(); 

xhttp.onreadystatechange = function() { 
if (this.readyState == 4 && this.status == 200) { 
    myFunction(this); 
     } 
    }; 

xhttp.open("GET", "test.xml", true); 
xhttp.send(); 

}, 5000); 

Answer 4

var xhttp = new XMLHttpRequest();  
function myFunction(xml) { 
var xmlDoc = xml.responseXML; 
    var item = xmlDoc.getElementsByTagName("item"); 
    var itemlength = item.length; 
    var i; 
    var html=''; 
    var today = new Date(); 

    var aktuella = []; 
    $("#wrapper").append('<ul id=\'wrap\'></ul>'); 

    for (i = 0; i < itemlength; i++) { 
    var postDate = xmlDoc.getElementsByTagName("expires")[i].childNodes[0].nodeValue; 
    var date = postDate.substring(8, 10); 
    var month = postDate.substring(5, 7); 
    var year = postDate.substring(0, 4); 
    var expiredDate = new Date(year, month - 1, date); 

    if (expiredDate > testDate) { 
    aktuella.push(i); 
    } 
}; 

if (aktuella.length == 0) { 
    var none = "<p>Info</p>"; 
    $('#wrapper').prepend(none); 
}; 

if (aktuella.length == 1) { 
    var expires = '<p>' + xmlDoc.getElementsByTagName("expires")[0].parentNode.childNodes[1].textContent + '</p>'; 
    $('#wrapper').prepend(expires); 
}; 

if (aktuella.length > 1) { 
    for (i = 0; i < aktuella.length; i++) { 
    var expires = '<li id="' + i + '">' + xmlDoc.getElementsByTagName("expires")[i].parentNode.childNodes[1].textContent + ' - Se Driftinfo</li>'; 
    $('#wrap').prepend(expires); 
    }; 
}; 


$(function(){ 
    $('#wrap').totemticker({ 
     row_height : '120px', 
     next  : '#ticker-next', 
     previous : '#ticker-previous', 
     stop  : null, 
     start  : null, 
     mousestop : true, 
     }); 
    }); 
} 

funtion makeinterval(){ 

xhttp.onreadystatechange = function() { 
    if (this.readyState == 4 && this.status == 200) { 
    myFunction(this); 
} 
}; 
xhttp.open("GET", "drift.xml", true); 
xhttp.send(); 
} 

setInterval(function(){ 
makeInterval(); 
}, 5000); 
makeinterval()