javascript - jquery“on”事件没有为点击事件触发？

Question

出于某种原因，我无法让我的“on”事件为点击事件触发。下面是调用和 HTML 的样子：

HTML：

<a class="cmt-replies-show" href="javascript:void(0)" id="cmt-count" style="">
  <span>View All</span>
</a>

jQuery：

$('.cmt-replies-show').on("click", function(e) {
  e.preventDefault();

  alert("Clicked");

});

知道我错过了什么吗？

score 3 · Accepted Answer

最可能的原因是绑定事件时元素不在 DOM 中。

如果你动态添加元素，你可以这样做：

$(document.body).on("click", '.cmt-replies-show', function(e) {

如果您的脚本包含在元素之前的页面中，您可以将脚本移动到正文的末尾或在readyevent 上调用您的代码：

$(function(){
  $('.cmt-replies-show').on("click", function(e) {
    e.preventDefault();
    alert("Clicked");
  });
});

score 0 · Accepted Answer

如果您尝试访问动态注入 DOM 的元素，则应使用以下语法：

$(document).on('click', '.cmt-replies-show', function(e) { 
// your code goes here
});

document可以用文档准备好时可用的每个父级替换。

score 0 · Accepted Answer

Paul 所说的 - 确保在 DOM 准备好之后绑定事件。

仅供参考，如果您直接使用“on”定位元素，则可以使用 $('a').click(function(){...}); . 如果您想像这样委派事件，“开”会更有用：

$('#container').on('click','a',function(){

});

score 0 · Accepted Answer

您可能会在脚本执行后定义 div。

将其包装起来$(document).ready(function() { .... });以确保它在完整的 DOM 可用后执行。

score 0 · Accepted Answer

我理解在页面上动态注入此链接的原因。您的 DOM 已经处于就绪状态，并且在注入这部分代码时读取了所有函数。

注入 HTML 时，将元素与 click 函数绑定。

使用 live() 应该可以解决您的目的-

 $('#yourLink').live('click', function(){
   //Your logic here
});

5 回答 5