jquery無法繞過這個

onklick綁定行在3個div上運行，但是它們全部在單擊時警告最後一個設置值i。我希望我所做的事情是有道理的，這很難解釋。它會警告3,3,3，而不是提醒1,2或3。jquery無法繞過這個

// Updates bar preview box 
this.updatePropertyMarkerBox = function(self, BarsID) { 

    ... snip ... 

    // Loop and add event handler 
    for (var i = 0; i < self.bars[BarsIndex].markers.length; i++) { 

     // Add click event 
     $("#bmi-" + self.containerId + "-" + i).bind('click', function() { 
      alert(i); 
     }); 
    }

來源

2011-06-27 Tom Gullen

的可能重複[事件不會被添加一個for循環（http://stackoverflow.com/questions/6332589/event-doesnt-get -ad-in-a-for-loop） –

剛剛回答完全一樣的東西：http://stackoverflow.com/questions/6492564/webkit-executesql-sentence-and-loop-problem/ – davin

@Felix：你的意思是之前曾被問過？ ; o） – user113716

當你在for循環迭代會，你基本上給出的地址給我，如果你在這個時候，它的值將是預期之內使用它的循環，但是如果你以後（比如在點擊事件），使用它，它會指向3.最後的增加值以獲得所需的影響，你可以創建一個匿名函數，像這樣

for (var i = 0; i < self.bars[BarsIndex].markers.length; i++) (function(i) { 

    // Add click event 
    $("#bmi-" + self.containerId + "-" + i).bind('click', function() { 
     alert(i); 
    }); 
})(i)

來源

2011-06-27 15:25:40 Robert

$("#bmi-" + self.containerId + "-" + i).bind('click', (function(i) { 
     return function() { 
      alert(i); 
     }; 
    })(i));

來源

2011-06-27 15:27:07

雖然你可以使用在循環中調用一個函數，創建一個新的變量作用域，它捕獲當前值i，另一種方法是簡單地通過元素的ID屬性取i值：

for (var i = 0; i < self.bars[BarsIndex].markers.length; i++) { 

    $("#bmi-" + self.containerId + "-" + i).bind('click', function() { 
      //grab the number from the ID of the element 
     alert(/\d+$/.exec(this.id)[0]); 
    }); 
}

實施例：http://jsfiddle.net/UGQA7/

來源

2011-06-27 15:29:43 user113716

甚至更好，使用HTML5 data- *屬性... –

@Ates：這當然是另一種可能性，但我不確定它會更好，因爲ID上已經存在該值。如果您使用'getAttribute（）'而不是'.attr（）'，性能可能會相當。不確定。 – user113716

在一個切線，一種更好的方式添加點擊處理程序以多個標記將只需將一個點擊處理程序添加到其容器中即可。 HTML可能類似於：

<div id=#bmi-xxx"> 
    <div class="marker" data-marker="0">...</div> 
    <div class="marker" data-marker="1">...</div> 
    ...

您可以使用通用HTML5數據屬性來存儲任意數據。

和JavaScript將是：

// Updates bar preview box 
this.updatePropertyMarkerBox = function (self, BarsID) { 

    ... snip ... 

    // Add event handler 
    $("#bmi-" + self.containerId).click(function (event) { 
     var marker = $(event.target).attr("data-marker"); 

     if (marker) { // Hey, it's a marker! 
      alert(marker); 
     } 
    });

來源

2011-06-27 15:34:58

jquery無法繞過這個

回答

相關問題