如何创建一个保存var值的函数

How to create a Function that preserve var values?

本文关键字:var 保存 函数 一个 何创建 创建      更新时间:2023-09-26

我有这个代码

<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时,显示消息"这是按钮A:11",如果用户再次单击按钮A,则显示"这是纽扣A:12",并且如果用户单击按钮B,则显示消息"this is buttonB:11"。我不想定义全局计数器变量,我想在函数上进行"封装"。即,如果我加上:

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

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

计数器相互独立并保持值。理解我的问题吗?

提前感谢

您可以考虑使用闭包。其基本思想是,创建一个创建"myFunctions"的函数,而不是只有一个"myFunction"。

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");