Question

我有这段代码

<input type="button" id="buttona" onClick="myFunction('this is buttonA')" />
<input type="button" id="buttonb" onClick="myFunction('this is buttonB')" />
<script>
function myFunction(message) {
  var count=10;
  count = count + 1;
  alert(message + ":" + count);
}
</script>

我想要的是当用户点击按钮A，显示消息＆＃34;这是按钮A：11＆＃34;，如果用户再次点击按钮A，显示＆＃34;这是按钮A：12＆＃34;，如果用户点击buttonB显示消息＆＃34;这是buttonB：11＆＃34;。我不想定义全球柜台变量，我想要＆＃34;封装＆＃34;关于功能。即如果我补充：

<input type="button" id="buttonc" onClick="myFunction('this is buttonC')" />;

具有相同的功能而无需定义几乎其他任何内容。

计数器相互独立并保留价值。理解我的问题？

提前致谢

Answer 1

你可以考虑使用闭包。基本的想法是，你不是创建一个单一的＆＃34; myFunction＆＃34;，而是创建一个创建＆＃34; myFunctions＆＃34;的函数。

function makeCounter(message){
    //We move count outside the onclick handler, so it can increment
    //but its not a global since we are inside another function!
    var count = 10; 
    return function(){
        count = count + 1;
        alert(message + ":" + count);
    };
}

//now use makeCounter to create encapsulated onclick handlers:

document.getElementById("buttona").onclick = makeCounter("This is button A");
document.getElementById("buttonb").onclick = makeCounter("This is button B");

如何创建保留var值的函数？

1 个答案: