Question

我使用DOM插入来生成一些数据输入对话框。我发现在某些浏览器中，特别是移动浏览器和IE-Mac，在.html()调用之后立即进行操作，可能是因为修改后的DOM还没有准备就绪。例如：

$.ajax({
    type: "GET",
    url: url,
    dataType: 'html',
    success: function (data, textStatus, jqXHR) {
        $("#theDialog").html(data);

        // hide address
        $("#theDialog #BillingAddress").closest("li").hide();
        ...

这在大多数情况下有效，但某些浏览器有时无法隐藏指示的<li>。调试起来一直很困难，因为进入控制台似乎允许浏览器完成DOM插入，因此当单步执行代码时，.hide() 总是。 / p>

我想我所追求的是$("#theDialog").on("ready")或来自.html()方法的回调。但那些似乎并不存在。

我已经想到了

切换到.load()，但最终我会转换为JSONP而我不认为.load()支持这种做法？
将.hide()和其他DOM操作放在返回数据中的脚本标记中。

我怀疑＃2是推荐的方法，但我想先在这里进行健全性检查。有没有人经历过这个？

非常感谢。

Answer 1

虽然我之前的回答有效，但它并没有解决你所有的问题。我建议像：

var myDiv=document.createElement( 'div' );
myDiv.innerHTML=data;
// now do all of your initializing, passing in myDiv like $( myDiv )
$("#theDialog").html(myDiv.innerHTML)
  .find( '#BillingAddress' )
  .closest("li")
  .hide();

希望这有效！

Answer 2

而不是：

$("#theDialog").html(data);
// hide address
$("#theDialog #BillingAddress").closest("li").hide();

你试过了吗？

$("#theDialog").html(data).find( '#BillingAddress' ).closest("li").hide();

我自己没有经历过这个，但希望这有效！

Answer 3

它没有回调函数，但您可以使用.promise()和.done()

$('#selector').html(someText).promise().done(function(){
        //callback code
    });

jquery.html（）有“准备好”或“完整”回调吗？

3 个答案: