jQuery'；。每个'；并附加'；。单击'；事件_Jquery_Each

jQuery'；。每个'；并附加'；。单击'；事件

jquery

jQuery'；。每个'；并附加'；。单击'；事件,jquery,each,Jquery,Each,我不是一个程序员，但我喜欢构建原型。我所有的经验都来自actionScript2 这是我的问题。为了简化我的代码，我想弄清楚如何将“.click”事件附加到HTML正文中已经存在的div <body> <div id="dog-selected">dog</div> <div id="cat-selected">cat</div> <div id="mouse-selected">mouse</div> <

我不是一个程序员，但我喜欢构建原型。我所有的经验都来自actionScript2

这是我的问题。为了简化我的代码，我想弄清楚如何将“.click”事件附加到HTML正文中已经存在的div

<body>
<div id="dog-selected">dog</div>
<div id="cat-selected">cat</div>
<div id="mouse-selected">mouse</div>

<div class="dog"><img></div>
<div class="cat"><img></div>
<div class="mouse"><img></div>
</body>

2）使用“.each”遍历数组，并使用“.click”事件扩充每个现有div。最后，构造一个局部变量

这是一个原型：

$.each(props, function(key, value) {    
$('#'+key+'-selected').click(function(){
var key = value;  
});
});

您可以使用的一个解决方案是为希望click事件处理程序绑定到的任何div分配一个更通用的类

例如：

HTML:

无需使用

。每个<代码>单击
已绑定到所有div
事件
$('div').click(function(e) {
    ..    
});


注意：使用硬绑定，例如。单击
，确保动态加载的元素不会被绑定。
是您正在寻找的吗？这似乎有效，有什么问题吗？你的代码已经完成了它要做的一切。你真的想在click事件中使用key变量吗？有趣的是，你能在div中包含变量吗？那是有效的HTML吗？谢谢大家的支持！在写这个原型和帖子的过程中，我似乎已经解决了这个问题。事实上，它确实很好！但感谢大家的贡献！这些与其说是变量，不如说是属性。id和类是相当标准的，但是您可以将data-{name}附加到元素中，并使用$（this.data（{name}'）访问内容；这是有效的html5。是的，但当您在每个条目上都有一个按钮时，这对存档不起作用。@Oriol是对的，另一种方法是使用on（）jQuery函数。这样它就可以处理动态加载的内容。这个解释非常有用，谢谢。
<body>
<div id="dog" class="selected" data-selected="false">dog</div>
<div id="cat" class="selected" data-selected="true">cat</div>
<div id="mouse" class="selected" data-selected="false">mouse</div>

<div class="dog"><img/></div>
<div class="cat"><img/></div>
<div class="mouse"><img/></div>
</body>

$( ".selected" ).each(function(index) {
    $(this).on("click", function(){
        // For the boolean value
        var boolKey = $(this).data('selected');
        // For the mammal value
        var mammalKey = $(this).attr('id'); 
    });
});

$('div').click(function(e) {
    ..    
});