已解決430363個問題，去搜搜看，總會有你想問的

將Click事件偵聽器添加到具有相同類的元素

首頁猿問將Click事件偵聽器添加到具有相...

將Click事件偵聽器添加到具有相同類的元素

JavaScript

元芳怎么了 2019-09-24 15:05:48

我有一個刪除ID的列表視圖。我想為具有特定類的所有元素添加一個偵聽器，并發出確認警報。我的問題是，這似乎只會將偵聽器添加到具有找到的類的第一個元素。我嘗試使用，querySelectorAll但是沒有用。var deleteLink = document.querySelector('.delete');deleteLink.addEventListener('click', function(event) { event.preventDefault(); var choice = confirm("sure u want to delete?"); if (choice) { return true; }});列表：<?php while($obj=$result->fetch_object()) { echo '<li><a class="delete" href="removeTruck.php?tid='.$obj->id.'">'.$obj->id.'</a>' . '<a href="#" class="delete"></a> </li>'."\n"; } /* free result set */ $result->close(); $mysqli->close();?>

查看完整描述

3 回答

慕慕森

TA貢獻1856條經驗獲得超17個贊

使用querySelectorAll和for循環的問題在于，它為數組中的每個元素創建了一個全新的事件處理程序。

有時候，這正是您想要的。但是，如果您有許多元素，則創建單個事件處理程序并將其附加到容器元素可能會更有效。然后，您可以event.target用來引用觸發事件的特定元素：

document.body.addEventListener("click", function (event) {

if (event.target.classList.contains("delete")) {

var title = event.target.getAttribute("title");

if (!confirm("sure u want to delete " + title)) {

event.preventDefault();

}

});

在此示例中，我們僅創建一個附加到該body元素的事件處理程序。每當body點擊內的元素時，click事件就會冒泡到我們的事件處理程序中。

反對回復 2019-09-24

飲歌長嘯

TA貢獻1951條經驗獲得超3個贊

您必須使用querySelectorAll需要選擇帶有所述類的所有元素，這又querySelectorAll是一個數組，因此您需要對其進行迭代并添加事件處理程序

var deleteLinks = document.querySelectorAll('.delete');

for (var i = 0; i < deleteLinks.length; i++) {

deleteLinks[i].addEventListener('click', function (event) {

event.preventDefault();

var choice = confirm("sure u want to delete?");

if (choice) {

return true;

}

});

}

反對回復 2019-09-24

3 回答
0 關注
472 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

將Click事件偵聽器添加到具有相同類的元素

將Click事件偵聽器添加到具有相同類的元素

3 回答

添加回答