没有互联网连接和超时的XMLHTTPRequest的脚本

Question

我有功能很多此代码为我的web应用程序

function ui_editlocation(id){ 

var hr = new XMLHttpRequest(); 

var url = "scripts/ui_processing.php"; 

var ui = "editlocation"; 

var vars = "ui="+ui+"&id="+id; 

hr.open("POST", url, true); 

hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 

hr.onreadystatechange = function() { 

    if(hr.readyState == 4 && hr.status == 200) { 

     var return_data = hr.responseText; 

     document.getElementById("ui_content").innerHTML = return_data; 

    } 

} 

hr.send(vars); 

document.getElementById("ui_content").innerHTML = "Loading..."; 

} 

我想，如果互联网连接中断时，得到一个消息，说“请添加一些代码检查您的互联网连接，请点击这里再试一次'

如果有互联网连接，我希望它在30秒后超时并说'我们的网络目前正在经历高需求，请点击这里再试'

我需要'点击h再次尝试'重新发送请求

我知道这是一个很大的问题，但任何帮助，将不胜感激。

感谢 卡尔

Answer 1

function ui_editlocation(id){ 
var hr = new XMLHttpRequest(); 
var timeout=setTimeout(function(){ 
    hr.abort(); 
    timeout=null; 
    if(confirm("Do you want to try again?")){ui_editlocation(id);} 
},30000); 

var url = "scripts/ui_processing.php"; 

var ui = "editlocation"; 

var vars = "ui="+ui+"&id="+id; 

hr.open("POST", url, true); 

hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 

hr.onreadystatechange = function() { 

    if(hr.readyState == 4 && hr.status == 200) { 
     if(timeout){cancelTimeout(timeout);timeout=null;} 

     var return_data = hr.responseText; 

     document.getElementById("ui_content").innerHTML = return_data; 

    } 

} 

hr.send(vars); 

document.getElementById("ui_content").innerHTML = "Loading..."; 

}