如何让onclick第三次做一些不同的事情

How to make onclick do something different the third time?

本文关键字：不同的事 第三次 onclick      更新时间：2024-01-04

我搜索了堆栈溢出，所有这些都只解释了onclick第二次如何做不同的事情，但我希望我的代码第三次也能做不同的东西。以下是当前javascript的一部分：

function one()
{
var newButton1 = '<button id="btnTwo" onclick="two();stickAmount();" >Pick up stick</button>'; var newButton2 = '<button id="btnThree" onclick="three()">Leave it there</button>';
document.getElementById("a").innerHTML="You feel something on the ground, and you think it's a stick."+newButton1+newButton2;
var myButton = document.getElementById('btnOne');
myButton.onclick = four;
}

我的猜测是，我应该做一些类似底部的varmyButton代码的操作，但如果我尝试这样做，它只会执行第三个操作，而跳过第二个操作。

为什么不在函数中使用静态变量？

您可以在按钮上附加一个计数器：

html:

<button id="btnOne" data-counter="0" onclick="one();" >Do It</button>

JavaScript:

var myButton = document.getElementById('btnOne');
function one() {
    var counter=parseInt(myButton.getAttribute("data-counter"),10);
    counter++;
    myButton.setAttribute("data-counter",counter);
    // do something based on the value of counter
}

计数器不是我需要的-

事实证明，我一开始做的是正确的，但myButton变量不应该在同一个函数中出现两次，我必须将myButton变量添加到函数四中。

相关文章：