Question

我正在使用两个盒子

<div id='box' onclick='loadFun();'>Load Content</div>
<div id='loading'></div>

功能

function loadFun() {
 $("#box").html('wait..').load('/content.php');
}

我需要它，以便当我点击DIV时box文字wait..应出现在DIV loading中，当内容加载完全时，DIV loading应该变为空。
同时我们可以设置如果内容在20秒内没有加载则应该取消请求的时间

Answer 1

试试这个

function loadFun() {
 $("#loading").html('wait..');
$("#box").load('/content.php',function(){
 $("#loading").html('');
});
}

Answer 2

.load有以下参数：

.load( url [, data ] [, complete(responseText, textStatus, XMLHttpRequest) ] )

现在您只使用：URL。

所以使用Function at Complete参数解决你的问题，比如@Hushme说：

function loadFun() {
     $("#loading").html('wait..');

     $("#box").load('/content.php',function(){   //here he loaded the content, and whenever Content loading completes he cleared the waiting msg...
     $("#loading").html('');

    });
}

在这里，他所做的是，每当Content.php中的内容成功加载时，删除#Loading Div中的Wait ...消息。

希望你得到清晰的图片。

Answer 3

我猜..您可以使用HushMe的答案来显示加载消息..如果内容未在20秒内加载，我想回答有关取消请求的问题。首先，jquery .load方法在内部使用$ .ajax方法，如果数据作为对象提供，则使用POST方法;否则，使用GET。因此，对于SETTING TIMEOUT，您可以简单地使用以下ajax调用，在请求超时后抛出错误。此外，在错误回调中，您可以检查是否因超时而发生错误，并且可以提供“请求超时...”等自定义消息。

$.ajax({
url: "/content.php",
error: function(jqXHR, textStatus){
    if(textStatus == 'timeout')
    {     
         alert('Request timed out..');         
    }
},
success: function(){
    //do something
},
timeout:20000
});

希望这会有所帮助..

使用ajax加载内容

3 个答案: