2

我真的很努力处理这段代码。

我想要实现的目标：我有一个“编辑按钮”。如果我按下它，它将变为活动状态并且编辑模式变为活动状态。我可以即时编辑列表，它会自动更新。

问题：我可以让它工作 50%。如果我尝试激活按钮，我可以编辑对象。但是当我再次停用按钮时，我仍然可以编辑对象。当然这应该是不可能的。

这里有一些乱七八糟的代码。是的，大部分都是在网上找到的，我正在尝试自己编辑它......

$("#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();
        });
    } 
});

提前致谢！

4

2 回答 2

3

.moveLi当编辑应该停止时，您将一堆事件处理程序绑定到但从不删除它们：

if ($("#editButton").hasClass("active")) {
    $(".moveLi").on("click", function() {
        ...
    }).change(function() {
        ...

用这样的东西补充这些：

$(".moveLi").off("click").unbind('change');
于 2012-05-10T12:47:34.777 回答
2

这行代码给出了错误$(".moveLi").on("click", function()。

它应该是$(".moveLi").click(function() {...})

您也可以使用 Firefox 的 Firebug 插件在其他浏览器中进行调试或其他内置开发人员工具，这样您就可以看到所有的 JS（和 CSS）错误。

于 2012-05-10T12:39:06.950 回答