爲什麼這個簡單的jQuery點擊事件不起作用？

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

試試這個

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

如果元素動態添加到DOM，你需要將它委託給最接近的靜態父元素這樣

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

DEMO

的文檔。 （）here

Answer 2

$(document).ready(function() { 

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

    alert('working'); 

    }); 

}); 

Answer 3

您正在嘗試使用event delegation其中元素沒有任何後代。 Fiddle

：如果你的元素是靜態的（通過當它被裝載標記創建），那麼就沒有必要使用事件委託，你可以在DOM準備處理

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

演示如下登記的處理程序

如果元素是在腳本準備好之後創建的，那麼在這種情況下，您需要使用事件委託，您需要將處理程序綁定到已存在的元素（如文檔對象或任何其他靜態元素），然後將第二個參數作爲動態元素選擇器的字符串

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

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