jquery - 如何在第二次单击时隐藏元素

Question

我想在第一次单击某个元素后隐藏该元素(使用 jQuery)，以便用户在此之后无法看到并单击该元素。

我怎样才能做到这一点？

谢谢。

Answer 1

非常简单:

$("selector").click(function() { $(this).hide(); });

上面的

"selector" 可以是任何有效的 jQuery selector (例如 ".click-to-hide" 使所有具有 click-to-hide 类的元素都具有此行为)。隐藏元素是使用 jQuery hide 完成的方法(如果您想让元素稍后再次可见，还有 show)。

如果您在第一次隐藏元素后根本不打算对它们执行任何操作，您可能还需要考虑 remove而不是隐藏。

更新:要在第二次单击时执行某些操作，您需要记住何时已经对某个元素进行了单击。如果事情不会变得更复杂，您可以使用一个类来实现此目的:

$("selector").click(function() {
    var $this = $(this);
    if ($this.hasClass("clicked-once")) {
        // already been clicked once, hide it
        $this.hide();
    }
    else {
        // first time this is clicked, mark it
        $this.addClass("clicked-once");
    }
});

如果你想统计点击次数，可以使用data函数来存储元素已收到的点击量:

$("selector").click(function() {
    var $this = $(this);

    // Current click count is previous click count +1
    var clickCount = ($this.data("click-count") || 0) + 1;

    // Save current click count
    $this.data("click-count", clickCount);

    if (clickCount == 1) {
        $this.hide();
    }
});