[英]how to properly make a count function work for all the dynamically generated buttons?
我正在編寫代碼,每次按下按鈕時加 1,按鈕是動態生成的,表格行也是動態生成的。 問題是如果有第二行或第三行,我無法使 function 正常工作。 我知道問題是每個按鈕都有相同的 class 因此計數將始終從另一個按鈕停止的地方開始。
$("form").submit(function(e){
e.preventDefault();
var name = $("input[name='name']").val();
$(".data-table tbody").append("<tr data-name='"+name+"' class='vote'><td>"+name+"</td><td><button class='but' id="+name+">VOTE</button></td><td><button class='btn btn-info btn-xs btn-edit'>Edit</button><button class='btn btn-danger btn-xs btn-delete'>Delete</button></td><td></td></tr>");
$("input[name='name']").val('');
});
// the code to count
let count = 1;
$("tbody").on("click", ".but", function(){
$(this).parents("tr").find("td:eq(3)").html('<span>'+count+'</span>');
return count++;
});
要清楚...... #1 Name button count john 4 jane 0
#2 在 jane 上按一下按鈕后 Name button count john 4 jane 5 我希望能夠在按下相應按鈕時從 1 開始計算 Jane 上的數字
我也盡量不使用任何插件
謝謝你的幫助。
首先更換
`<button class='but' id="+name+">VOTE</button> `
和
<button class='but' id="+name+" data-count="clicked-0">VOTE</button>
現在你的計數代碼
$("tbody").on("click", ".but", function() {
let obj = $(this);
let clicks = obj.attr('data-count').replace('clicked-','');
clicks++;
obj.attr('data-count','clicked-'+clicks);
obj.parents("tr").find("td:eq(3)").html('<span>' + clicks + '</span>');
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.