javascript - jQuery .load() 阻止了我在移动设备上的脚本

Question

这个问题已经有答案了:

Event binding on dynamically created elements? (23 个回答)

已关闭 4 年前。

我正在使用 jQuery .load()在我的页面中包含一些 HTML。内容按预期显示，但绑定(bind)到包含的 HTML 的所有事件均不起作用

$('.main').empty().load("foo.html");
$(function() {
  $('select').on('change', function(){
    alert('bar');
  });
});

它适用于桌面设备，但不适用于移动设备。我不明白为什么......我想 load()函数负责这一点，因为只要我将 HTML 内容直接放入主页中，它就会起作用......

Answer 1

根据docs ，您需要利用 complete 回调来了解 HTML 何时完成加载。由于此操作是异步的，因此您需要等待其完成，然后再尝试将事件处理程序附加到尚未加载的 DOM 元素。

$('.main').empty().load("foo.html", function complete() {
  $('select').on('change', function(){
    alert('bar');
  });
});