Question

假设我有以下js代码

$(function() {
   $('#some_id').load('myfile.html', function() {
      alert('Call back called');
   });

  alert('You should alert second');
  // more javascript code .........

});

出于某种原因，alert('Call back called');是最后被提醒我的事情。我认为js代码按文件的顺序执行。有没有办法让alert('Call back called');在我的所有其他功能之前先行。

查看我的简单代码片段，可以建议为什么不在函数调用中放置alert('You should alert second');，遗憾的是我继承了一个非常大的代码库，并且在我的回调中干扰所有这些函数调用都不可行< / p>

Answer 1

.load()是一个异步方法，只有当异步方法完成执行时，才会将作为参数传递给它的匿名函数执行。

Answer 2

“我认为js代码按文件的顺序执行。”确实如此，这就是这里发生的事情。但是因为.load()回调函数是一个回调（即只有在异步操作完成后才会触发），alert('Call back called');只会在将来的某个时刻调用它时触发。

Answer 3

正如其他人所指出的，load是一种异步方法，因此您需要使用类似于同步AJAX调用的方法。以这种方式使用它：

$.ajax({
     url:    'myfile.html',
     async:   false
     success: function(result) {
                  alert('Call back called');
              }
});

alert('You should alert second');

Answer 4

您可以使用Deferred Object来处理异步调用。这样做，无论何时发回响应，您的代码都将按阅读顺序执行：

$(function() {
    var jqxhr = $.get('myfile.html', function(data) {
        $('#some_id').html(data);
        alert('Call back called');
    });
    jqxhr.done(function() { 
        alert('You will alert second');
    });
});

Answer 5

使用纯javascript ，只需为第二个alert()区域内的内容添加一个带有回调参数的函数：

$(function() {

   function someCode (callback) {
     $('#some_id').load('myfile.html', function() {
       alert('Call back called');
       // add parameters, if you like
       callback();
     });
   }

   function someMoreCode() {
     alert('You should alert second');
     // more javascript code .........
   }

   // And Finally...
   someCode(someMoreCode);

});

Answer 6

如果你希望alert('You should alert second');发生第二次，你需要在你的回调函数中调用它：

$(function() {
   $('#some_id').load('myfile.html', function() {
      alert('Call back called');
      alert('You should alert second');
   });

});

在jquery回调后执行代码

6 个答案: