0

使用 jQuery,我创建了一个弹出对话框,然后使用 .load() 从文章 URL 中提取的信息填充 div .side-article-title、.side-article-subtitle 和 .side-article-detail。

但是 .side-article-detail 的高度需要根据上面提到的其他 2 个的高度而改变,我似乎无法获得变量 detailheight 来从 .height() 的 ajax 返回值中减去这些值;

jQuery

$('body').prepend('<div class="side-article"><div class="side-article-close">X</div><div class="like">Like This</div><div class="article-inner"><div class="side-article-title"></div><div class="side-article-subtitle"></div><div class="side-article-detail"></div></div></div>');

var titleheight = null;
var subtitleheight = null;
var articleHeight = null;
$('.side-article-title').load(thisURL+' #item-title',function(){
        titleheight = $('.side-article-title').height();
        console.log(titleheight);
    });
    $('.side-article-subtitle').load(thisURL+' #item-subtitle',function(){
        subtitleheight = $('.side-article-subtitle').height();
        console.log(subtitleheight);
    });
    $('.side-article-detail').load(thisURL+' #item-detail',function(){
        $('#item-detail').jScrollPane();
    });

将高度设置为的元素

    var detailheight = articleHeight -  titleheight - subtitleheight;
    $('.side-article-detail, .jspContainer').css('height',detailheight);
4

1 回答 1

1

ajax 的所有功能都需要在完成后在回调中完成。你不能依赖他们以任何顺序工作:

$.when($('.side-article-title').load(thisURL+' #item-title', function () {...}),
   $("...").load(...),
   $("...").load(...)
).done(function () {
   var detailheight = articleHeight -  titleheight - subtitleheight;
});

只有当所有ajax 请求都完成后,.done回调才会触发。

于 2013-01-30T00:12:34.873 回答