Question

我确信这已被反复讨论过，但我很难过。我正在使用jQuery对ASP.NET Web服务进行AJAX调用，该服务返回一些HTML。那部分工作正常。

我想对返回的HTML的高度做一些计算，但是当第一次调用时我得到的高度为0.我知道我的计算刚刚在AJAX调用完成之前发生，因为在第二次尝试它的工作原理。如果我清除缓存然后再次返回0。

我需要在渲染html后触发一个事件。我尝试了ajaxComplete等全球和本地活动。

$.ajax({
    type: "POST",
    url: "Webservices/Service.asmx/HelloWorld",
    data: "{}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(msg) {
        $("#OverlayContent").html(msg.d);
    }
    complete: function(msg) {
        alert($("#OverlayContent").height());
    } 
});

我感谢任何帮助。

Answer 1

在插入html并在DOM中呈现之前，听起来你的身高计算正在运行。确保使用setTimeout调用或间隔错开它。例如：

$.ajax({
    type: "POST",
    url: "Webservices/Service.asmx/HelloWorld",
    data: "{}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(msg) {
        $("#OverlayContent").html(msg.d);
        setTimeout(function(){ getHeight();},100);
    }
});

function getHeight(){
    // If our height is 0, set a new timeout and we'll check again
    if($("#OverlayContent").height() === 0){
        setTimeout(function(){ getHeight() }, 100);
    }
    else{
        alert("The height is: " + $("#OverlayContent").height());
    }
}

您需要对插入到DOM中的html进行轮询并进行渲染。

Answer 2

如果在成功事件之前没有，则完全事件很可能同时触发，因为一旦完成AJAX数据的完成就会完全触发。成功事件在收到带有 200 OK状态代码的返回数据后被触发。

你可以使用延迟，但我个人认为使用jQuery的queue（）方法会更好：

success: function(msg) { $("#OverlayContent").html(msg.d).queue(function(){ alert($("#OverlayContent").height()); $(this).dequeue(); }) }

最后的dequeue（）重要的是恢复正常的事物流。

此时你完全摆脱了完整的回调。

Answer 3

我可能不完全理解您的问题，但您可以尝试在完成事件后立即运行的超时中设置更新代码...

//..your other code here

complete:function(m) {
    setTimeout(function() {
        alert($("#OverlayContent").height());
    },1);
}

//...the rest of your code

为什么我无法检索为响应jQuery AJAX请求而插入的内容的计算高度？

3 个答案: