我有几个带有点击功能的div,基本上是为您选择的框"投票"。
这很有效,直到有人想选择第二个或第三个盒子。click函数与div的类绑定,所以我需要在单击一次之后禁用click函数。
$('.vote').on('click',function(){
$(this).append('<div id="voted">Thanks!<form><input type="text" name="comment"></form></div>');
});
<div class="vote">Option A</div>
<div class="vote">Option B</div>
<div class="vote">Option C</div>
我必须使用"one"函数来禁用当前div上的单击函数,以便用户可以单击表单输入。问题是其他选项仍然是"可点击的"。因此,如果用户愿意,他们可以对这三个选项进行投票。我怎么能把投票限制在一票以内?
虽然提供的两种解决方案都能工作,但删除事件处理程序是有意义的,因为它无论如何都不会被使用。
我建议这个代码
$('.vote').on('click.vote', function () {
$(this).append('<div id="voted">Thanks!<form><input type="text" name="comment"></form></div>');
$('.vote').off('click.vote');
});
使用带名称空间的事件,您将不会更改其他单击事件处理程序(如果有的话)。
类不应以句点开头:
<div class="vote">Option A</div>
<div class="vote">Option B</div>
<div class="vote">Option C</div>
使用标志使整个类只能点击一次:
var flag = true;
$('.vote').one('click',function(){
if (flag) {
$(this).append('<div id="vote">Thanks!<form><input type="text" name="comment"></form></div>');
flag = false;
}
});
FIDDLE
var clicked=0;
$('.vote').on('click',function(){
if(clicked==0){
clicked=1;
$(this).append('<div id="voted">Thanks!<form><input type="text" name="comment"></form></div>');
}
});
使用变量。设置其值