為什么單擊此 JQuery 腳本中的按鈕時此單擊事件不起作用？

Question

我很久沒有使用JQuery 了，今天我發現了一些問題。 我正在使用一個非常舊的 JQuery 版本 (3.0.0)，但我無法更新它。

所以我的問題是在我的 HTML 代碼中我有這樣的按鈕：

<button class="btn-link js-delete" data-customer-id="1">Delete</button>

然后這是我的 JQuery 腳本：

$("#customers").click(".js-delete", function () {
    alert("CLICK !!!");
});

這是我的 JSFiddle： https ://jsfiddle.net/AndreaNobili/xpvt214o/906659/

問題是點擊按鈕沒有任何反應

我該如何嘗試解決這個問題？

Answer 1

您缺少將該button包裝在id值為customers的元素中：

 $("#customers").click(".js-delete", function() { alert("CLICK !!!"); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id='customers'> <button class="btn-link js-delete" data-customer-id="1">Delete</button> </div>

但是建議的方法是直接使用該按鈕的類，如果該類對於該按鈕是唯一的，並且該 JS 代碼將僅用於該按鈕：

 $(".js-delete").click(function() { alert("CLICK !!!"); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button class="btn-link js-delete" data-customer-id="1">Delete</button>

Answer 2

嘗試這個：

<button class="btn-link js-delete" data-customer-id="1">Delete</button>



$(".js-delete").click(".js-delete", function () {
    alert("CLICK !!!");
});

您的代碼選擇帶有 #costumers 而不是您的按鈕的元素，因為它與客戶沒有 id

Answer 3

這種情況下的選擇器是“.js-delete”。 首先，您需要調用選擇器而不是事件。

$(".js-delete").click(function () {
    alert("CLICK !!!");
});

Answer 4

您通過 ID (#customer) 調用了該元素，但 Button 中沒有 ID 屬性。 用這個替換按鈕元素：刪除

Answer 5

你忘了給按鈕id="customers" 。