如何使用 JavaScript 检查按钮是否被点击答案

【问题标题】：How to check whether a Button is clicked by using JavaScript如何使用 JavaScript 检查按钮是否被点击
【发布时间】：2011-02-16 19:23:02
【问题描述】：

有没有一种简单的方法可以按照这些思路做某事：

JavaScript：

if(document.getElementById('button').clicked == true)
{
   alert("button was clicked");
}

HTML：

<input id="button" type="submit" name="button" value="enter"/>

【问题讨论】：

标签： javascript dom-events

【解决方案1】：

您可以为此添加点击事件处理程序：

document.getElementById('button').onclick = function() {
   alert("button was clicked");
};

这将在单击时发出警报，如果您想稍后跟踪它，只需在该函数中将变量设置为 true 而不是警报，或者 variable++ 如果您想计算点击次数，无论您的最终用途是什么是。 You can see an example here.

【讨论】：

请注意，设置 onclick 将覆盖现有的事件侦听器，因此在这里使用 addEventListener 可能会更好，如下所述 (stackoverflow.com/a/57811342/10965456)

【解决方案2】：

尝试为点击添加事件监听器：

document.getElementById('button').addEventListener("click", function() {
   alert("You clicked me");
});

使用addEventListener 可能是一个更好的主意，然后设置onclick - onclick 很容易被另一段代码覆盖。

你可以使用一个变量来存储按钮之前是否被点击过：

var clicked = false
document.getElementById('button').addEventListener("click", function() {
   clicked = true
});

addEventListener on MDN

【讨论】：

【解决方案3】：

这样就可以了

<input id="button" type="submit" name="button" onclick="myFunction();" value="enter"/>

<script>
function myFunction(){
    alert("You button was pressed");
};   
</script>

【讨论】：

【解决方案4】：

这里的所有答案都讨论了 onclick 方法，但是您也可以使用 addEventListener()。

addEventListener()的语法

document.getElementById('button').addEventListener("click",{function defination});

上面的函数定义称为匿名函数。

如果您不想使用匿名函数，也可以使用函数引用。

function functionName(){
//function defination
}



document.getElementById('button').addEventListener("click",functionName);

您可以在此答案here 中查看 onclick() 和 addEventListener() 之间的详细差异。

【讨论】：

我想你错过了一个...stackoverflow.com/a/57811342/10965456

【解决方案5】：

只需连接 onclick 事件：

<input id="button" type="submit" name="button" value="enter" onclick="myFunction();"/>

【讨论】：

请不要使用内联处理程序，there are so many reasons not to do this。

【解决方案6】：

$("#button").on('click',function(){
//do something
});

【讨论】：

【解决方案7】：

你可以这样做：

<button onClick="funtion()">Button Goes Here</button

function alert(){
console.log('Alert Showed');
alert('You clicked me!');
}

&lt;button onClick="alert()"&gt;Click me to get alerted&lt;/button&gt;

【讨论】：

欢迎来到 StackOverflow。虽然此代码可能会回答问题，但提供有关如何和/或 为什么 解决问题的附加上下文将提高答案的长期价值。

【解决方案8】：

function check() { 
    console.log("Button Clicked");
};

var button= document.querySelector("button"); // Accessing The Button // 
button.addEventListener("click", check); // Adding event to call function when clicked //

【讨论】：

【解决方案9】：

document.querySelector("#button").addEventListener("click", () => {
    console.log("button was clicked");
})

【讨论】：