Question

我有一组带有一个名为mod的数据属性的元素，如下所示：

<div data-mod="2">Close</div>
<div data-mod="0">Ban</div>

一个jQuery函数，用于检查是否已单击其中一个div，然后是警报确认以处理该操作。

$("body").on("click", "div[data-mod]", function() {
    var btn = $(this);
    if (btn.hasClass("inactive")) {
        return false;
    } else {
        var confirm = alert.Confirm("Are you sure?");
        $("body").on("click", "[data-alert=0]", function() {
            alert.Close($(this).parents("#alert"));
            return false;
        });
        $("body").on("click", "[data-alert=1]", function() {
            console.info(btn);
            btn.addClass("inactive");
        });
    }
});

问题是，如果您取消警报然后单击下一个div并确认操作，则两个单击的div将获得＆＃34;不活动＆＃34; class，因为var btn现在是两个单击的div。例如，如果有三个div并且只有两个div，则第三个div保留其原始类。

有没有办法让var btn只存储最后点击的div的值而不是两个值？

提前致谢，

马特乌斯

更新

$("body").on("click", "div[data-mod]", function() {
    var btn = $(this);
    if (btn.hasClass("inactive")) {
        return false;
    } else {
        alert.Check("Tem certeza?");
        $("body").on("click", "[data-alert=0]", function() {
            alert.Close($(this).parents("#alert"));
            return false;
        });
        $("body").on("click", "[data-alert=1]", function() {
            console.info(btn);
            btn.addClass("inactive");
        });
    }
});

警报变量是：

var alert = {
  Check: function() {
    var content = $("#contentalerts");
    $.get("/../static/alertconfirm.tpl", function(alert) {
      content.append(alert);
      content.find("#alert").last().draggable();
    });
    content.on("click", ".close", function() {
      alert.Close($(this).parents("#alert"));
    });
    $(window).on("keyup", function(e) {
      if (e.keyCode === 27) alert.Close($("#alert").last());
    });
  },
  Close: function(content) {
    content.remove();
  } 
};

Answer 1

您不应该使用confirm作为变量名称，这是一个保留字。

尝试重命名然后测试它是否解决你的奇怪问题。

请参阅Windows Reserved Words。

Answer 2

我的猜测是您在代码中使用自定义确认或警告框。就像@Hinx所说，confirm是一个保留字。所以最好避免将其用作变量！

无论如何，这是对代码的一个小重新排列，以便给你一个想法：

var btn;

$("body").on("click", "div[data-mod]", function() {
    btn = $(this);
    if (btn.hasClass("inactive")) {
        return false;
    } else {

        // show your custom confirm box here
        $('#my_custom_confirm_box').show();

    }
});

$("body").on("click", "[data-alert=0]", function() {
    $('#my_custom_confirm_box').hide();

    return false;
});
$("body").on("click", "[data-alert=1]", function() {    
    $(btn).addClass("inactive");

    $('#my_custom_confirm_box').hide();

    return false;
});

jQuery数据元素奇怪的行为

2 个答案: