Javascript 动态创建的js脚本onClick函数变量未绑定到当前值

Javascript 动态创建的js脚本onClick函数变量未绑定到当前值,javascript,function,variables,dynamically-generated,Javascript,Function,Variables,Dynamically Generated,因此,当我动态生成其中4个按钮时,四个按钮中的每一个都会将第一个按钮的信息传递到函数启动表单中。我怀疑这是因为当变量z完成时,它的for语句返回到0。如果是这种情况,则按钮1的+z为+1,按钮2的+z为+2,而所有按钮的+z为+0 我该如何解决这个问题?谢谢 编辑:添加以响应更多信息请求: newButton.onclick = function() { launchForm( this, incoming[(10 * (incoming.length / fields))

因此,当我动态生成其中4个按钮时,四个按钮中的每一个都会将第一个按钮的信息传递到函数启动表单中。我怀疑这是因为当变量z完成时,它的for语句返回到0。如果是这种情况,则按钮1的+z为+1,按钮2的+z为+2,而所有按钮的+z为+0

我该如何解决这个问题?谢谢

编辑:添加以响应更多信息请求:

newButton.onclick = function() {
  launchForm(
    this, 
    incoming[(10 * (incoming.length / fields)) + z],
    incoming[(48 * (incoming.length / fields)) + z]);
};
所以我对这一切都很陌生,所以我可能用错了词。加载页面后创建的我的理解项被视为动态项。--虽然我是新来的,但我很有信心问题在于我最初提出的问题。通过设置警报和测试,我可以看到第一个按钮完全按照它应该的方式工作,并且所有适当的参数都被完美地传递。只是按钮2、3和4也会启动按钮1启动的功能。Incoming.length不更改,字段不更改。与创建newButton的第一个实例到第二个实例时唯一不同的是z当我在创建第二、第三和第四个按钮后立即设置警报时,它们会准确地显示应该传递的参数。但是,在创建它们的函数完成后(基于使用z作为变量的for语句),它们将转换回好像z是0并使用按钮1的参数(因为在按钮1的参数中z等于0)。我只是将+1、+2、+3硬编码到代码中,而不是z,但是创建的按钮数量取决于查询。有时是1个按钮,有时是10个。所以这真的不是一个选择


我希望这有帮助。

ES5不使用块上下文,而是在函数上下文上操作。这意味着,在
for
循环中,必须立即使用索引变量,否则,如果(例如)在回调函数中引用该变量,则将在回调执行期间获得该变量的值

有多种方法可以解决此问题,用代码演示可能是最简单的方法:

“严格使用”;
//首先,使用[].forEach.call有一些缺点,所以我们应该
//将节点列表转换为数组的一种方法
var toArray=功能(输入){
var输出=[];
//检查是否有类似数组的对象
if(input&&typeof-input.length=='undefined'){return;}
对于(变量i=0;i

ES5不使用块上下文,而是在函数上下文上操作。这意味着,在
for
循环中,必须立即使用索引变量,否则,如果(例如)在回调函数中引用该变量,则将在回调执行期间获得该变量的值

有多种方法可以解决此问题,用代码演示可能是最简单的方法:

“严格使用”;
//首先,使用[].forEach.call有一些缺点,所以我们应该
//将节点列表转换为数组的一种方法
var toArray=功能(输入){
var输出=[];
//检查是否有类似数组的对象
if(input&&typeof-input.length=='undefined'){return;}
对于(变量i=0;i

单击时,所有处理程序都引用z的当前值。我建议在定义上使用z的值

  • 通过调用函数作为构造函数来创建onclick处理程序,并计算主体字符串中z的当前值:

        var newButton = document.createElement('button');
        newButton.className = 'pure-button pure-button-primary mikeButton';
        newButton.innerHTML='Launch Form';
        newDiv4.appendChild(newButton);
    
  • 或者,在创建onclick处理程序时,在button对象上保存z值:

    newButton.onclick = new Function("launchForm(this, incoming[(10 * (incoming.length / fields)) + "+ z + "], incoming[(48 * (incoming.length / fields)) + " + z  + "]);");
    

  • 但在函数体中将对“z”的引用替换为“this['data-z']”。

    单击时,所有处理程序都引用z的当前值。对你
    newButton["data-z"] = z;
    newButton.onclick = function() {....};