我有以下功能:
$('#edit').on("click", function () {
$('#edit').text('click1');
$('table a').click(function (e) {
e.preventDefault();
});
$('table a').css("cursor", "default");
}
});
$('#edit').click(function () {
$('#edit').unbind();
$('#edit-message-placeholder').empty();
$('#edit').text('click2');
$("table tbody").sortable("disable");
$('table a').unbind()
$('table a').css("cursor", "auto");
});
});
首次点击,我希望它更改div#edit
的文字。在第二次单击时,它会将文本更改为其他内容。在第三次单击时,该函数的行为就像第一次单击它一样。
我试图在网上找到解决方案,但没有发现任何有用的东西。
答案 0 :(得分:2)
问题在于您未能正确接近此问题。您不需要绑定/取消绑定事件处理程序。您只需要一个在功能上交替的事件处理程序:
<强>的JavaScript 强>
var isOkay = true;
$("p").click(function () {
if (isOkay) {
$(this).text("1st click");
} else {
$(this).text("2nd click");
}
isOkay = !isOkay;
})
<强> HTML 强>
<p>Click me!</p>
每次单击<p>
时,它都会执行操作,然后切换布尔变量isOkay
的值。这意味着它将在if
和else
块之间切换。请注意,isOkay
变量不在$("p").click(...)
事件处理程序的范围内。
答案 1 :(得分:2)
试试这个 -
使用data
属性暂时保存计数器数据
<button id="edit" data-count="1">1</button>
function doWork(val){
alert(val);
};
$('#edit').on("click", function () {
if($(this).data('count') == ""){
$(this).data('count') = 1;
}
var count = parseInt($(this).data('count'));
if (count == 1){
doWork(count);
}else if (count == 2){
doWork(count);
}else if (count == 3){
doWork(count);
}
count += 1
count = count >= 4 ? 1: count;
$(this).data('count', count);
$(this).html($(this).data('count'));
});
这是jsfiddle - http://jsfiddle.net/pt3zE/1/