Ajax изпраща повторно XMLHttpRequest

Имам js/ajax скрипт от страна на клиента като този:

<p>server  time  is:  <strong  id="stime">Please  wait...</strong></p>

<script>
function  updateAjax()  {
    xmlhttp  =  new  XMLHttpRequest();
    xmlhttp.onreadystatechange  =  function()  {
        if (xmlhttp.readyState==3  &&  xmlhttp.status==200)  {
            document.getElementById("stime").innerHTML=
            xmlhttp.responseText;
        }
        if  (xmlhttp.readyState==4)  {  
            xmlhttp.open("GET","date-sleep.php",true);
            xmlhttp.send();
        }
    }
    xmlhttp.open("GET","date-sleep.php",true);  
    xmlhttp.send();
}
window.setTimeout("updateAjax();",100);
</script>

И a от страната на сървъра:

<?php
    echo  6;
    for  ($i=0;  $i<10;  $i++)  {
        echo  $i;
        ob_flush();  flush();
        sleep(1);
    }
?>

След първо „отвори“ и „изпрати“ работи добре, но когато сървърът завърши скрипта и xmlhttp.readyState == 4 тогава xmlhttp изпраща повторно заявката, но нищо не се случва.


javascript xmlhttprequest ajax
person jllj    schedule 03.06.2012    source източник

Отговори (1)


arrow_upward
2
arrow_downward

Вместо да използвате отново един и същ XHR обект през цялото време, опитайте да повторите функцията с нов обект. Това трябва поне да коригира проблемите с несъвместимостта, както сте изброили.

Опитайте да извикате отново вашата Ajax функция вътре в нейното обратно извикване, ако искате да я зациклите безкрайно.

if  (xmlhttp.readyState==4) {  
     updateAjax(); //or setTimeout("updateAjax();",100); if you want a delay
}

Бих предложил също да поставите вашия .innerHTML метод вътре в .readyState==4, когато исканият документ е напълно зареден, и .status==200, което означава успех. Като този:

if (xmlhttp.readyState==4  &&  xmlhttp.status==200) {
       document.getElementById("stime").innerHTML=
       xmlhttp.responseText;
       updateAjax(); //or setTimeout("updateAjax();",100);
}

Също така, ако искате вашият Ajax да е междубраузърен, трябва да тествате дали браузърът поддържа XHR обект който използвате:

var xmlhttp = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");

Току-що написах кода по-горе, но трябва да работи добре, за да добави съвместимост с по-стари версии на IE и други браузъри.

person Fabrício Matté    schedule 03.06.2012
comment
Разбрах, че работи в Iceweasel. Предполагам, че не работи правилно поради някакво кеширане на firefox. Модифицирането на innerHTML в този блок „if“ ще промени поведението на скрипта, който трябва да актуализира страницата винаги след като сървърът изпрати следващите данни, а не само когато връзката се затвори. - person jllj; 04.06.2012
comment
Моето решение по-горе е кръстосано браузър, с изключение на това, че не сте тествали правилно XHR обекта на браузъра. Ще го добавя и към отговора. - person Fabrício Matté; 04.06.2012
comment
Ctrl+F5 вашия firefox и опитайте моя скрипт. Трябва да прави точно това, което искате, и да е съвместим с различни браузъри, ако не, опитайте да възпроизведете проблема си в jsfiddle или още един пейзаж на живо. - person Fabrício Matté; 04.06.2012
comment
Благодаря за вашият отговор. Това е само примерен код от моите класове, така че съвместимостта между браузърите не е толкова важна. - person jllj; 04.06.2012
comment
Ясно, разбрах. Тогава пренебрегнете частта с кода за кръстосани браузъри, моят код по-горе трябва най-малкото да зацикля безкрайно, както подсказва въпросът ви. Ако имате нужда от .readyState==3, използвайте само първия ми блок код в отговора. Кажете ми, ако имате проблеми с кода след това. =] - person Fabrício Matté; 04.06.2012