使用循環設置mousedown函數

我有一大堆類似的列表項，我想附加mousedown()函數。所以，我希望做的是替換此：使用循環設置mousedown函數

$('#controls li[id=d1]').mousedown(function(){ 
    console.log('d1'); 
}); 
$('#controls li[id=d2]').mousedown(function(){ 
    console.log('d2'); 
});

與此：

var loopvar; 
for (loopvar = 1; loopvar <= 2; loopvar++) { 
    $('#controls li[id=d' + loopvar + ']').mousedown(function(){ 
     console.log('d' + loopvar); 
    }); 
}

（這是一個簡單的例子 - 我其實有很多li的處理）但是當我點擊一個li，我總是在控制檯上得到d3。循環結束時，loopvar的值爲3，所以看起來就是這樣。那麼如何使用循環附加函數呢？

來源

2013-09-11 Jon

你剛剛遇見一個叫做閉包的東西。 JavaScript中最強大但最危險的一個（如果你不知道如何使用它）。 –

歡迎來到JavaScript閉包http://stackoverflow.com/questions/111102/how-do-javascript-closures-work – fujy

在這種情況下，您可以使用console.log（this.id） – bfavaretto

你永遠也不會做。
你應該使用類而不是id。

如果一定要使用的ID，請嘗試：

$('#controls li[id^="d"]').mousedown(function(){ 
    console.log($(this).attr('id')); 
});

要使用一個循環，你必須使用一個封閉傳遞變種，但它的壞分配回調這樣，使用上面的方法。

for (var i = 0; i < 3; ++i) { 
    (function(loopvar) { 
     $('#controls li[id=d' + loopvar + ']').mousedown(function(){ 
      console.log('d' + loopvar); 
     }); 
    })(i); 
}

來源

2013-09-11 00:19:34 OneOfOne

感謝jquery選擇器的想法，並使用類而不是id。好東西。我是一名C程序員，因此我立即跳轉到for（）'循環來處理這類事情。 – Jon

歡迎來到javascript世界，一旦你掌握了它，它就是一個美好的世界。 – OneOfOne

試試這個方法：

var loopvar; 
for (loopvar = 1; loopvar <= 3; loopvar++) { 
    $('#controls li[id=d' + loopvar + ']').mousedown((function(loopvar){ 
     return function(e){ 
      console.log(e); 
      console.log('d' + loopvar); 
     } 
    })(loopvar)); //You create a closure locking in the loop iteration variable 
}

但理想的情況下，應該只需要一個事件綁定到一個選擇要麼usind一個共同的類名或使用ID與選擇開始。 Fiddle

隨着startswith選擇：

$('#controls li[id^=d]').mousedown(function(e){ 
     console.log(this.id); //here this represents the element you clicked on. 
    } 
);

Fiddle

也千萬記住ID開始與選擇的屬性選擇，並會慢相比，一類選擇

來源

2013-09-11 00:16:49 PSL

如果考試PLE你寫的是非常相似的實際代碼，我會解決這個問題是這樣的：

$('#controls').find('li[id]').mousedown(function(){ 
    console.log(this.getAttribute('id')); 
    // If you want to use jQuery... 
    // console.log($(this).attr('id')); 
});

注意$('#controls').find('li[id]')略快$('#controls li[id]')

來源

2013-09-11 00:17:01

使用循環設置mousedown函數

回答

相關問題