Question

我在更新ajax请求后未准备好的元素时遇到问题。

如果我在页面加载时运行我的myFunction()函数，就像这样：

$(function() {
 myFunction();
}

我没有任何问题。但是，如果我然后使用像

这样的东西

$.ajax({
      url: this.href,
      dataType: "script",
      complete: function(xhr, status) {
        myFunction();
      }
    });

返回$(".myElement").replaceWith("htmlHere")。当完整事件触发时，元素根本就没有准备好。如果我在那里设置延迟，它再次正常工作。

当DOM准备就绪时，还有除“完成”之外的任何其他事件被触发吗？

更新

这是实际的代码：

$(function() {
  $("a.remote").live("click", function(e) {    
    $.ajax({
      url: this.href,
      dataType: "script",
      success: function(xhr, status) {
                myFunction();
            }
    });

    e.preventDefault();
    return false;
  });

  myFunction();
});

function myFunction() {
    // Modify the dom in here
}

失踪者）;对我来说只是一个错字。

我现在尝试使用成功而不是完成，但似乎没有任何区别。

Answer 1

我根据您的代码设置了jsfiddle，它似乎正在运作。

这是当前的代码：

 $(function() {
  $("a.remote").live("click", function(e) {    
    $.ajax({
      url: this.href,
      dataType: "script",
      success: function(xhr, status) {
                myFunction();
            }
    });

    e.preventDefault();
    return false;
  });

});

function myFunction() {
    $("span").replaceWith("<p>test</p>");
}

它用段落替换span标记。请检查并与您的代码进行比较。如果它是相同的，那么你的问题不是这个函数（可能在myFunction中？）。

Answer 2

您可以使用$(document).ready(function() { ... });来包装DOM加载时要触发的任何内容。如果您希望等待dom加载，您的ajax请求可以放在document.ready内。

如果你想等到ajax加载了它的资源，那么你应该使用ajax.success而不是complete。

Answer 3

只需在complete:来电中将success:更改为$.ajax()：

$.ajax({
      url: this.href,
      dataType: "script",
      success: function(xhr, status) {
        //make your DOM changes here
        myFunction();
      }
});

一旦AJAX请求收到成功响应，success函数就会运行。因此，在该函数中更改DOM，然后运行myFunction()。

修改
您似乎正在尝试使用myFunction()进行DOM更改。但是如果你没有先将AJAX响应中收到的HTML插入到DOM中，那么myFunction()就没有任何内容可以修改。如果确实发生了这种情况，那么您有两种选择：

将响应HTML插入DOM，然后调用myFunction()（所有这些都应在success回调函数中发生。）

将AJAX响应作为参数传递给myFunction()，以便myFunction()可以处理DOM插入，然后进行必要的修改。

Answer 4

每次ajax调用后都会触发一个事件。它被称为ajaxComplete。

$( document ).ajaxComplete(function() {
    $( ".log" ).text( "Triggered ajaxComplete handler." );
});

所以你可以

function Init(){
  // stuff here
}

$(document).ready(function()
  Init();
});
$(document).ajaxComplete(function()
  Init();
});

Answer 5

您缺少文档就绪包装函数的右括号。

$(function() {
 myFunction();
});

请注意最后的});。

Answer 6

$(function() {
 myFunction();
}

应该是

$(document).ready(function() {
 myFunction();
});

或者你希望ajax在加载时运行。做

$(document).ready(function() {
 $.ajax();
});

在ajax请求之后准备好jQuery文档

6 个答案: