我不是一个程序员,但我喜欢建造原型.我的所有经验都来自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>
Run Code Online (Sandbox Code Playgroud)
我的(失败的)策略是:
1)制作一个对象数组:
var props = {
"dog": "false",
"cat": "true",
"mouse": "false"
};
Run Code Online (Sandbox Code Playgroud)
2)使用'.each'遍历数组并使用'.click'事件扩充每个现有div.最后,构造一个局部变量.
这是一个原型:
$.each(props, function(key, value) {
$('#'+key+'-selected').click(function(){
var key = value;
});
});
Run Code Online (Sandbox Code Playgroud)
Nei*_*len 83
One solution you could use is to assign a more generalized class to any div you want the click event handler bound to.
For example:
HTML:
<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>
Run Code Online (Sandbox Code Playgroud)
JS:
$( ".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');
});
});
Run Code Online (Sandbox Code Playgroud)
Ori*_*iol 19
无需使用.each
.click
已经绑定到所有div
事件.
$('div').click(function(e) {
..
});
Run Code Online (Sandbox Code Playgroud)
注意:使用硬绑定,例如.click
确保动态加载的元素不受约束.
归档时间: |
|
查看次数: |
142672 次 |
最近记录: |