注入.load（）时，jquery.on（）不绑定自定义事件

假设我在同一个文档中有一些带有代码的div：

<div id="trigger">Click Me!</div>
<div id="handler">Handler</div>

<script type="text/javascript">
    $("#handler").on('check', function() {alert('Handler is working!');})
    $("#trigger").on('click', function()
       {$("#handler").trigger('check');alert('Trigger is working!')
    })
</script>

点击我！
处理者
$（“#处理程序”）.on（'check'，function（）{alert（'handler's working！'）；}）
$（“#触发器”）。在（'click'，function（）上
{$（“#处理程序”）.trigger（'check'）；alert（'trigger is working！'）
})

它按预期工作

但是，如果我使用

.load（）

将所有这些注入到页面中，那么只有（本机）触发器事件，而不是（自定义）处理程序事件起作用

我想这与计时有关，但我认为

.on（）

应该负责计时问题

编辑：解决方案

---

我完全搞错了。我不知道与上述内容同时加载的文档有自己对Jquery源代码的引用。因此，在DOM中已有的Jquery版本之上加载了另一个版本的Jquery。现在它在没有

.ready（）

的情况下工作，甚至使用原始语法。

---

塔克斯

您试图做的是在元素

#handler

存在之前访问它（.load需要一些时间才能将其拉入页面）

相反，.on还支持侦听尚不存在的元素

$("body").on("click", "#handler", function() { alert("Clicked on #handler"); });

---

这将监听body元素（应该存在）上的任何对ID#handler元素的单击，即使该元素后来被注入。

，因为您需要指定父选择器以考虑动态创建的元素

例如：

$("body").on('check', '#handler', function() {alert('Handler is working!');})

---

这里有一个很好的相关问题：

如果您将所有内容加载到页面、脚本以及绑定到的元素中，那么甚至可以将代码包装成

$（document）.ready（function（）{//your code Here}）将等待执行，直到DOM就绪。否则，如果只注入HTML而不注入脚本，则需要使用
on（）
重载进行动态绑定，正如
Mash
所述。我尝试了这一点，并在alert（）的帮助下发现，当使用.load（）注入代码时，代码的运行顺序与注入的顺序完全相同，如果我将其放入$（document）.ready（）中，则没有任何匹配，$（window）.ready（）或在这些函数之外。谢谢，我不知道.on（）的功能根据语法的不同而有所不同。不幸的是，我的示例代码过于简化。在我的真实代码中，我用$.post同时加载了另外两个（不相关的）div。我现在发现，如果我对这两个调用进行注释，它可以很好地使用这两个语法。如果让调用运行，则只有本机click事件可以工作。