[英]Prevent on click function from firing multiple times
我試圖做一個簡單的click函數,但是當我這樣做時,它將觸發數組中有多少個項目的確切時間。 因此,如果單擊該按鈕,則會顯示它觸發3次,因為數組中有3個項(湖,腔,太陽)。 我的問題是如何防止它觸發x次?
var TeamPlayers = [{
team: 'Lakers',
Players: ['Russell', 'Clarkson', 'Ingram', 'Randle', 'Zubacs']
}, {
team: 'Cavs',
Players: ['Irving', 'Smith', 'LeBron', 'Love', 'Thompson']
}, {
team: 'Suns',
Players: ['Ulis', 'Booker', 'Warren', 'Chriss', 'Len']
}]
for (var i = 0; i < TeamPlayers.length; i++) {
var TeamPlayersVar = TeamPlayers[i].team
// console.log('outside loop',TeamPlayers[i].team);
$('.leftPlayer').append('<button class="leftButtons">' + TeamPlayers[i].team + '</button>' + '<br>')
$(document).on('click', '.leftButtons', function(){
console.log(this)
});
}
我建議使用id來做到這一點。 那應該解決您的問題。 因為點擊將被注冊為ID
for (var i = 0; i < TeamPlayers.length; i++) {
var TeamPlayersVar = TeamPlayers[i].team
// console.log('outside loop',TeamPlayers[i].team);
$('.leftPlayer').append('<button id="btn'+i+'" class="leftButtons">' + TeamPlayers[i].team + '</button>' + '<br>')
$("#btn"+i).click(function(){
console.log(this)
});
}
之所以發生這種情況,是因為您要在Click偵聽器上分配一個類,並且有3個具有指定類名的元素,為了使其只能使用一次,請使用ID或使用唯一的類名
您只需要將點擊處理程序代碼放在循環之外,即
var TeamPlayers = [{
team: 'Lakers',
Players: ['Russell', 'Clarkson', 'Ingram', 'Randle', 'Zubacs']
}, {
team: 'Cavs',
Players: ['Irving', 'Smith', 'LeBron', 'Love', 'Thompson']
}, {
team: 'Suns',
Players: ['Ulis', 'Booker', 'Warren', 'Chriss', 'Len']
}]
for (var i = 0; i < TeamPlayers.length; i++) {
var TeamPlayersVar = TeamPlayers[i].team
// console.log('outside loop',TeamPlayers[i].team);
$('.leftPlayer').append('<button class="leftButtons">' + TeamPlayers[i].team + '</button>' + '<br>')
}//for()
$(document).on('click', '.leftButtons', function(){
console.log(this)
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.