Question

$('div > .card-body > .text-muted').append('<div class="card-body" style="background-color:#292b2e;border-radius:5px;">'+data+'<a class="btn btn-secondary">Sell</a></div>').last().on('click', function(){
  console.log("SellClicked " + hatassetid);
  window.location.href = "https://domain/asset/"+assetid+"/sell";
});

我很难解决jQuery脚本，它附加了可点击的新按钮来执行操作。按钮确实显示，它们都是可点击的。但是，当我单击其中一个按钮时，所有附加的按钮都会运行SellClicked函数，无论我点击哪个按钮，都会在最后找到的项目中结束，只能每次都能运行。

是否有更可靠的方法来附加带有点击功能的可点击按钮？

输出始终响应。

SellClicked 84600 SellClicked 84683 SellClicked 84703 SellClicked 85056 SellClicked 85488 SellClicked 86296 SellClicked 87379 卖了点击88709 SellClicked 90299 SellClicked 96525

Answer 1

如果您在console.log($(this))内进行.on，则会发现它返回了父元素.text_muted，而不是按钮。这是因为.on()方法应用于选择器$("div > .card-body > .text-muted")，而不是按钮。

这意味着，您的按钮实际上并不起作用，它是＆＃39; .text_muted＆＃39;上的事件监听器。工作（测试并证实了这一点）。它还意味着你为循环的每次迭代为这个父元素创建一个新的事件监听器，从而重复输出。

要解决这个问题，我会删除＆＃34; .last（）。on（）＆＃34;，在添加一个类时按下它并为其创建一个事件监听器：

$('div > .card-body > .text-muted').append('<div class="card-body" style="background-color:#292b2e;border-radius:5px;">'+data+'<a class="btn btn-secondary myButtonClass">Sell</a></div>')

$(".myButtonClass").click(function(){
     <do something>
})

<强>加成：您的代码有点不完整，因此我们无法确定您的代码在何处被评估为＆＃39; hatassetid＆＃39;来自，但如果您需要通过点击按钮传递数据，您只需将资产ID（或其他）添加为＆＃34;数据 - ＆＃34;属性并从事件侦听器函数访问它：

<a class="btn btn-secondary myButtonClass" data-assetId='+assetID+'></a>

然后：

$(".myButtonClass").click(function(){
         var assetId = this.data('assetid') //please note, data() attributes must be selected using all lowercase characters
     })

API

jQuery，仅对每个项目应用click事件

1 个答案: