單擊后執行jQuery函數

Question

我正在努力處理以下內容：

<script>
$('button').click(function(){
alert("button clicked");
});
</script>

<button type="button" class="button-save">Save</button>

單擊按鈕時沒有收到警報。 我嘗試使用按鈕定位課程，但這也無濟於事。 當我像這個答案一樣單擊“保存”按鈕時，我試圖執行一些ajax（當然不是我的示例），因此我需要查找用戶單擊按鈕的時間。

有人可以幫忙嗎？

Answer 1

您必須等待頁面完全呈現以綁定處理程序，否則元素尚不存在。 您有兩個選擇，可在呈現HTML之后將script標簽移動到：

<button type="button" class="button-save">Save</button>

<script>
    $('button').click(function(){
        alert("button clicked");
    });
</script>

或將代碼包裝在DOM ready語句中。

<script>
    $(document).ready(function() {
        $('button').click(function(){
            alert("button clicked");
        });
    });
</script>

<button type="button" class="button-save">Save</button>

Answer 2

在您的html頁面的頭部添加此行

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

並將代碼重寫為：

$( document ).ready(function() {
   $('button').click(function(){
       alert("button clicked");
   });
});

Answer 3

您需要像這樣包裝代碼：

$(document).ready( function() {
    // your code goes here
});

上面的代碼基本上說：“將文檔及其所有元素加載到文檔中並准備好運行。然后執行代碼。”