jQuery Ajax .html() 就绪请求

Question

我使用 Jquery Ajax 加载内容并使用 .html() 方法将其插入到 div 中。之后我需要获取加载内容的高度来计算进一步的大小，但似乎内容最终没有加载。当我尝试获得它的高度时，它有时可以正常工作，但有时我会得到一个很小的高度值。

Ajax 加载函数：

function loadPage(url,data){
    jQuery.ajax({
        'url': url,
        'dataType': 'json',
        'data': data,
        success: function(data,s,xhdr){ // data, status
                        if(!data){ return false };
            pagenav(data);
        }
    });
    return false;}

function pagenav(data){
    if(!data){ return false };
    if(typeof(data.content)=="object"){
        for(var i in data.content){
            if(data.content[i].target_id == 'panelMain'){
                        jQuery('#panelMain').html(data.content[0].content);
                            setTimeout(function(){ 
                                onLoad();
                            },0);

            }else{
                jQuery('#panelFooter').html(data.content[1].content);
            }
        }
    }
    }

onLoad 函数处理整个高度的事情。我试图在操作新元素之前使用 setTimeout 方法使 DOM 完全加载。将超时设置为更大的值（比如说 500）对我来说很好，但我猜这不是正确的方法。

提前致谢

Answer 1

您的代码有几个问题，我可以看到...

首先，当数据评估为 false 时，您在 pagenav() 中返回一些内容，这与您在 ajax 成功回调中所做的检查相同。

其次，您遍历data.content，将键放入变量i。在那个 for 循环中，您检查data.content 中的当前键是否具有等于“panelMain”的属性target_id。如果这是真的，您会以某种方式假设 w/e 进入面板主将在 data.content[0] => 我相信这应该是 data.content[i] 否？

您的 onLoad() 调用在 for 循环中，因此 in 可能会被多次调用或在 for 循环结束之前被调用....

这是我认为你想要做的：

function loadPage(url, data) {
    jQuery.ajax({
        'url': url,
        'dataType': 'json',
        'data': data,
        success: function(data, s, xhdr) { // data, status
            if (!data) {
                return false
            };

            pagenav(data);
        }
    });
    return false; // mind you this function will always return false since ajax calls are async
}

function pagenav(data) {
    if (typeof(data.content) == "object") {
        for (var i in data.content) {
            jQuery('#' + data.content[i].target_id).html(data.content[i].content);
        }

        onLoad();
    }
}