Question

所以我需要在点击至少两次之后隐藏输入标签。这是我的JS / JQuery :(注意我对语言很新）

var clickcounter = 0;
var clicker = document.getElementById("show-img-btn");

$("clicker").click(function(){
    clickcounter = clickcounter + 1;
});

if (clickcounter >= 2) {("clicker").style.display = "none;"};

我真的不知道这个问题的解决方案。这可能是一件简单的事情，如没有足够的等号或复杂的事情，因为整个事情是错误的。请纠正我！

Answer 1

我会使用Immediately Invoked Function Expression (IIFE)来保持计数变量不受页面上其他脚本的影响。

您需要将所有逻辑放在click事件处理程序中，因为脚本的其余部分只运行一次。

您可以通过在条件语句中使用count变量的前缀增量来简化检查。

＆＃13;

(function(count){
    $("#show-img-btn").click(function(){
        if(++count === 2) this.style.display = 'none';
        return false; // returning false prevents form submission
    });
})(0);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" id="show-img-btn" value="click me!">

＆＃13;

如果没有其他任何东西需要在第二次点击上完成，你可以进一步简化它。

＆＃13;

(function(count){
    $("#show-img-btn").click(function(){
        return ++count === 2 && (this.style.display = 'none'), false;
        // increment & check; hide on second click; always return false
    });
})(0);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" id="show-img-btn" value="click me!">

＆＃13;

Answer 2

这应该会帮助你，

<div id="clickMe">Click me!</div>

var counter = 0;
var clickMe = document.getElementById("clickMe");

clickMe.addEventListener("click", function () {
    counter += 1;

    if (counter == 5)
        clickMe.style.display = "none";

    console.log(counter);
});

你应该根据自己的需要进行调整。正如您所看到的，我每次点击div时都会检查计数器，而不像您曾经只点击过一次。

示例

http://jsfiddle.net/xcgh99ut/

修改1

此外，您的代码中也有错误。

$("clicker").click(function(){ }

根据你的代码clicker是变量所以它应该是，

$(clicker).click(function() { }

或者使用jQuery，

$("#show-img-btn").click(function () { }

Answer 3

if (clickcounter >= 2) {("clicker").style.display = "none;"};

if (clickcounter >= 2) {alert("Hello! I am an alert box!!");};

将这段代码移动到事件处理程序中。否则，只在解析代码时运行一次，clickcounter = 0;。

如果您将其放入$("clicker").click(function(){，则会在每次触发事件时运行。

Answer 4

这是一个有效的代码：https://jsfiddle.net/xj1noced/ 您必须将您的条件放入onclick事件中 - 因此每次用户单击该元素时它都会运行。

HTML：

<div id="clicker">
     <div id="show-img-btn">Foo</div>
</div>

的javascript：

var clickcounter = 0;
var clicker = document.getElementById("show-img-btn");

$("#clicker").click(function(){
     clickcounter = clickcounter + 1;
     if (clickcounter >= 2) {$("#clicker").css("display", "none")};
});

如何在点击次数后隐藏元素？

4 个答案: