我正在通过 javascript(使用 jQuery)生成一个无序列表.每个列表项必须接收自己的点击"事件监听器.但是,我无法将正确的回调附加到正确的项目.一个(剥离的)代码示例可能会让事情变得更清楚:
I'm generating an unordered list through javascript (using jQuery). Each listitem must receive its own event listener for the 'click'-event. However, I'm having trouble getting the right callback attached to the right item. A (stripped) code sample might clear things up a bit:
for(class_id in classes) {
callback = function() { this.selectClass(class_id) };
li_item = jQuery('<li></li>')
.click(callback);
}
实际上,本次迭代中还有更多内容,但我认为这与问题不太相关.无论如何,正在发生的事情是回调函数似乎是 referenced 而不是 stored (& 复制).最终结果?当用户点击任何列表项时,它总是会执行classes
last class_id
的动作> 数组,因为它在该特定点使用存储在 callback
中的函数.
Actually, more is going on in this iteration, but I didn't think it was very relevant to the question. In any case, what's happening is that the callback function seems to be referenced rather than stored (& copied). End result? When a user clicks any of the list items, it will always execute the action for the last class_id
in the classes
array, as it uses the function stored in callback
at that specific point.
我发现了一些肮脏的解决方法(例如在封闭的 a
元素中解析 href
属性),但我想知道是否有办法实现我的目标干净"的方式.如果我的方法很可怕,请说出来,只要你告诉我原因:-) 谢谢!
I found dirty workarounds (such as parsing the href
attribute in an enclosed a
element), but I was wondering whether there is a way to achieve my goals in a 'clean' way. If my approach is horrifying, please say so, as long as you tell me why :-) Thanks!
这是做你想做的更好的清洁方式.
This is a better cleaner way of doing what you want.
使用 .data() 将 class_id 信息添加到元素上.
Add the class_id info onto the element using .data().
然后使用 .live() 为所有新元素添加点击处理程序,这样可以避免 x * 点击函数.
Then use .live() to add a click handler to all the new elements, this avoids having x * click functions.
for(class_id in classes) {
li_item = jQuery('<li></li>').data('class_id', class_id).addClass('someClass');
}
//setup click handler on new li's
$('li.someClass').live('click', myFunction )
function myFunction(){
//get class_id
var classId = $(this).data('class_id');
//do something
}
这篇关于如何在javascript(jQuery)中分配迭代数组的事件回调的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!