Javascript 在onclick中使用变量（即使以后更改，也保留旧的变量值）

我有一个问题，需要使用用户提供的变量在javascript按钮中动态添加onclick事件问题：这些变量将更改，但我不希望onclick事件全部更改

我写了一个小例子，它模仿了我的设置（但显然去掉了不必要的部分，因此看起来有点傻）

注意：我尝试使用以下方法克隆变量：

1) clone = Object.assign({}, old);

2) clone = JSON.parse(JSON.stringify(old);

两者都不起作用

这是代码笔：

HTML:

Javascript

btn1 = document.createElement('button');
var one_class = "button black";
btn1.className = one_class;
btn1.addEventListener('click', function() {btn1.className = one_class;})
add_first = document.getElementById('1');
add_first.appendChild(btn1).html;
one_class = "button blue"

可以使用指定特定值作为事件处理程序的第一个参数。这将作为

one\u类

的字符串原语工作

btn1.addEventListener('click', function(cls, event) {
       btn1.className = cls;
}.bind(null, one_class));

可以使用指定特定值作为事件处理程序的第一个参数。这将作为

one\u类

的字符串原语工作

btn1.addEventListener('click', function(cls, event) {
       btn1.className = cls;
}.bind(null, one_class));

btn1.addEventListener('click', function(cls, event) {
       btn1.className = cls;
}.bind(null, one_class));