Question

我之前问了一个类似的问题，一个答案说要用这个：

var clickCounter=0;
input.onclick=function() {
 clickCounter++;
    if (clickCounter==2) {
     window.alert("Hello");
    }
   };

但这不起作用是我的代码：

<!DOCTYPE html>
<html>
 <body>
  <script>
   var clickCounter=0;
   input.onclick=function() {
    clickCounter++;
    if (clickCounter==2) {
     window.alert("Hello");
    }
   };
  </script>
  <input id="testing" type="button" value="X" onClick="value='Clear'" style="border-radius: 10px; transition: 5s;">
 </body>
</html>

我试图在iPhone上清除通知。

Answer 1

您需要定义变量“input”。

在纯JavaScript中，您可以使用getElementById()：

var input=document.getElementById('testing');

http://jsfiddle.net/S9wQ2/

编辑：

正如Steve（和Guffa）所提到的，将你的javascript包装在onload事件中，以便在你的Javascript执行之前加载DOM，如下所示：

window.onload=function() {

    var input = document.getElementById('testing');
    var clickCounter = 0;
    input.onclick = function () {
        clickCounter++;
        if (clickCounter == 2) {
            window.alert("Hello");
        }
    };

}

http://jsfiddle.net/S9wQ2/2/

Answer 2

您尚未定义input是什么，它必须是对元素的引用。此外，您需要在元素存在后运行代码。

<!DOCTYPE html>
<html>
 <head>
  <title>page title</title>
  <script>
   var clickCounter=0;
   window.onload = function(){
    document.getElementById("testing").onclick = function() {
     clickCounter++;
     if (clickCounter==2) {
      window.alert("Hello");
     }
    };
   }
  </script>
 </head
 <body>
  <input id="testing" type="button" value="X" style="border-radius: 10px; transition: 5s;">
 </body>
</html>

脚本通常会进入head标记，并且还应该有title作为有效的HTML文档。

Answer 3

jsFiddle Example

HTML：

<button id="Button1">Button</button>

JS：

var clickCounter=0;
var button1 = document.getElementById('Button1')
button1.onclick=function() {
  clickCounter++;
  if (clickCounter==2) {
    window.alert("Hello");
  }
};

Answer 4

顺便说一下，有一个原生的double click event：

document.getElementById("testing").ondblclick=function() {
     window.alert("Hello");
};

Fiddle example

如何在第二次点击时进行操作？

4 个答案:

编辑：