Question

在我的标题中加载了jQuery（版本1.8.3）。

但如果我试试这个：

<button id="idiot" type="button">Generate</button>

<script> 

$( document ).ready(function () {

  $("#idiot").on("click", "#idiot", function () {

    alert( 'working');

  });

});

</script>

我一无所获。

为什么我要点击此按钮提示弹出窗口。但是现在它没有用。为什么呢？

Answer 1

$( document ).ready(function () {

  $("body").on("click", "#idiot", function () {

    alert( 'working');

  });

});

Answer 2

您正在尝试使用event delegation，其中元素没有任何后代。如果你的元素是静态的（在加载时由标记创建），那么就不需要使用事件委托，你可以在dom ready handler中注册处理程序

//shortcut for document ready
jQuery(function ($) {
    $("#idiot").on("click",function () {
        alert('working');
    });
});

演示：Fiddle

如果在dom准备好脚本之后创建元素，则需要使用事件委托，在这种情况下，您需要将处理程序绑定到已存在的元素，如文档对象或任何其他静态元素，然后将第二个参数传递为动态元素选择器的字符串

$(document).on("click", '#idiot', function () {
    alert('working');
});

Answer 3

试试这个

$("#idiot").on("click", function () {
    alert('working');
});

如果元素动态添加到DOM，您需要将它委托给最近的静态父元素，如下所示

$(document).on("click","#idiot", function () {
    alert('working');
});

DEMO

.on（）here

的文档

Answer 4

检查出来： -

http://jsfiddle.net/SXzK7/

<button id="genius" type="button">Generate</button>

 $("#genius").click(function () {

    alert( 'you are a genius');

});

Answer 5

你不必选择一个后代。

使用以下内容：

$( document ).ready(function () {

  $("#idiot").on("click", onIdiotButtonPress);

});

function onIdiotButtonPress(event){
        alert( 'working');
}

Here is a working Fiddle

为什么这个简单的jQuery点击事件不起作用？

5 个答案: