javascript 检查按钮是否处于活动状态
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10534012/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Check if button is active
提问by 6olden
I'm really struggling with this piece of code.
我真的很纠结这段代码。
What I'm trying to achieve: I have an "edit button". If I press it, it'll go active and edit mode goes active. I can edit the list on the fly and it updates automatically.
我想要实现的目标：我有一个“编辑按钮”。如果我按下它，它将激活并且编辑模式激活。我可以即时编辑列表并自动更新。
Problem: I can get it to work for 50%. If I try to activate the button I can edit the objects. But when I deactivate the button again I can still edit the objects. Of course that shouldn't be possible.
问题：我可以让它工作 50%。如果我尝试激活按钮，我可以编辑对象。但是当我再次停用按钮时，我仍然可以编辑对象。当然，这应该是不可能的。
Here some messy code. Yeah most of it is found online and I'm trying to edit it myself...
这里有些乱码。是的，大部分是在网上找到的，我正在尝试自己编辑...
$("#editButton").click(function() {
$("#editButton").toggleClass("active");
if ($("#editButton").hasClass("active")) {
$(".moveLi").on("click", function() {
var ID = $(this).attr('id');
$("#move_"+ID).hide();
$("#move_edit_"+ID).show();
}).change(function() {
var ID = $(this).attr('id');
var first = $("#move_edit_"+ID).val();
var dataString = 'id=' + ID + '&name=' + first;
$("#move_"+ID).html('<p>Saving...</p>'); // Loading image
if (first.length > 0) {
$.ajax({
type: "POST",
url: "table_edit_ajax.php",
data: dataString,
cache: false,
success: function(html) {
$("#move_"+ID).html(first);
}
});
}
else {
alert('Enter something.');
}
});
$(".editbox").mouseup(function() {
return false
});
$(document).mouseup(function() {
$(".editbox").hide();
$(".text").show();
});
}
});
Thanks in advance!
提前致谢！
回答by jbabey
You bind a bunch of event handlers to .moveLibut never remove them when editing is supposed to stop:
您绑定了一堆事件处理程序，.moveLi但在编辑应该停止时从不删除它们：
if ($("#editButton").hasClass("active")) {
$(".moveLi").on("click", function() {
...
}).change(function() {
...
supplement these with something like this:
用这样的东西补充这些：
$(".moveLi").off("click").unbind('change');
回答by Bud Damyanov
This line of code gave error $(".moveLi").on("click", function().
这行代码给出了错误$(".moveLi").on("click", function()。
It should be $(".moveLi").click(function() {...})
它应该是 $(".moveLi").click(function() {...})
You also can use Firebug plug-in for Firefox for debugging or other built-in developer tools in other browsers, this way you can see all of the JS (and CSS) errors.
您还可以使用 Firefox 的 Firebug 插件进行调试或其他浏览器中的其他内置开发人员工具，这样您就可以看到所有 JS（和 CSS）错误。
