两次点击在同一个按钮上的两个事件答案

【问题标题】：Two events on the same button with two click两次点击在同一个按钮上的两个事件
【发布时间】：2018-09-08 03:45:18
【问题描述】：

我需要创建一个像这样工作的按钮：

var i = true

first click --> var i = false
second click --> var i = true
....

HTML

 <input type="button" value="test" onclick="stop(); start();" />

如何在我的 JS 文档中指定这些函数？

【问题讨论】：

Toggle a boolean in javascript

标签： javascript html button

【解决方案1】：

您可以通过这样做来切换布尔值：

var b = true;
b = !b

在你的情况下使用：

<input type="button" value="test" onclick="b = !b;" />

最好用函数来做这个

var b = true;
function toggle () { b = !b; console.log(b) }

在你的 html 中

<input type="button" value="test" onclick="toggle();" />

【讨论】：

【解决方案2】：

你可以这样做

<input type="button" value="test" />

还有 javascript 代码。

var btn = document.getElementsByTagName('input')[0];
var i = true;

btn.addEventListener('click', function() {
    if (i == true)
        i = false;
    else
        i = true;
});

【讨论】：

【解决方案3】：

为点击做一个计数器

var countClick= 0

if (countClick== 1) {
        //do the first click code
    }
    if (countClick== 2) {
        //do the second click code
    }

【讨论】：

【解决方案4】：

您可以简单地将函数调用与onclick 事件相关联，然后切换boolean 值：

var i = true;
function clicked () {
  //toggle the value
  i = !i; 
  console.log(i);
}

&lt;input type="button" value="test" onclick="clicked();" /&gt;

【讨论】：

【解决方案5】：

这是一个可以做你想做的事的 sn-p。您可以让它永远切换，也可以像您的示例一样只切换一次。

var buttonClicks = 0;
var boolValue = true;
var boolValueOutput = document.getElementById("boolValue")

boolValueOutput.innerHTML = boolValue;

function onButtonClick()
{
  buttonClicks++;

  // If you want it to only work once uncomment this
  //if (buttonClicks > 2)
  //  return;
  
  boolValue = !boolValue;
  boolValueOutput.innerHTML = boolValue;
}

<input type="button" value="test" onclick="onButtonClick();" />
<p id="boolValue"></p>

【讨论】：