Javascript 将动态生成的对象数组传递给onclick处理程序

我正在动态生成一个

onclick

处理程序，并使用

attr

方法对其进行设置

var originReference = "myDynamicString";
var stringArray = [];
stringArray.push("Data1");
stringArray.push("Data2");
var objArray = [];
objArray.push({name: "Category 1", y: 10});
objArray.push({name: "Category 2", y: 20});

onclickReference.attr("onclick", "drawChart('" + originReference + "',[" + stringArray + "],[" + objArray + "]); return false;");

使用此代码时，

objArray

没有正确地传递给处理程序事件，因为我得到了错误：

元素列表后的“SyntaxError:缺少]

只使用字符串数组（无JSON）。数据被很好地传递给处理程序

---

如何在

onclick

处理程序中格式化对象数组？

不要使用

onclick

属性绑定事件。使用

addEventListener

添加事件

onclickReference.click(function(){
    drawChart(originReference, stringArray, jsonArray);
    return false;
});

编辑：根据您的评论，您正在循环中绑定事件。在这种情况下，您需要创建一个闭包来“捕获”变量的值

试试这个：

onclickReference.each(function(){
    // Define your variables inside this new scope
    var originReference = "myDynamicString";
    var stringArray = [];
    var objArray = [];

    this.click(function(){
        drawChart(originReference, stringArray, jsonArray);
        return false;
    });
});

---

不要使用

onclick

属性绑定事件。使用

addEventListener

添加事件

onclickReference.click(function(){
    drawChart(originReference, stringArray, jsonArray);
    return false;
});

编辑：根据您的评论，您正在循环中绑定事件。在这种情况下，您需要创建一个闭包来“捕获”变量的值

试试这个：

onclickReference.each(function(){
    // Define your variables inside this new scope
    var originReference = "myDynamicString";
    var stringArray = [];
    var objArray = [];

    this.click(function(){
        drawChart(originReference, stringArray, jsonArray);
        return false;
    });
});

---

您应该使用JSON.stringify将javascript对象转换为JSON字符串

onclickReference.attr("onclick", "drawChart('" + originReference + "'," + JSON.stringify(stringArray) + "," + JSON.stringify(jsonArray) + "); return false;");

---

但正如@Rocket Hazmat所说，使用

onclick

属性进行事件绑定是一种不好的方法。

您应该使用JSON.stringify将javascript对象转换为JSON字符串

onclickReference.attr("onclick", "drawChart('" + originReference + "'," + JSON.stringify(stringArray) + "," + JSON.stringify(jsonArray) + "); return false;");

---

但是正如@Rocket Hazmat所说，使用

onclick

属性进行事件绑定是一种不好的方法。

我认为不需要连接变量。您可以简单地使用drawChart（originReference、stringArray、jsonArray）；另外，代码中没有“JSON数组”。您的

jsonArray

只是一个对象数组。JSON是数据的字符串表示形式，类似于JavaScript对象/数组语法。如果它不是字符串，也不是JSON。谢谢，我可以更正。更改了问题中的措辞。我认为不需要连接变量。您可以简单地使用drawChart（originReference、stringArray、jsonArray）；另外，代码中没有“JSON数组”。您的

jsonArray

只是一个对象数组。JSON是数据的字符串表示形式，类似于JavaScript对象/数组语法。如果它不是字符串，也不是JSON。谢谢，我可以更正。更改了问题中的措辞。My

onclickReference

的填充方式如下：

onclickReference=$（this.find（“a”）。因此，
addEventListener
抛出非函数错误。如果我引用
$（this.find（“a”）[0]我的数据似乎不存在，我没有意识到
onclickReference
是一个jQuery对象。在这种情况下，它只是
onclickReference.click（function（）{…}）。这不起作用，因为我正在迭代一组“a”元素，其中每个事件侦听器的originReference和objArray的值都会发生变化。在这种情况下，在我的click事件中传递给函数的所有变量的值都将是最终值。我需要它在迭代过程中根据值进行更改。我的
onclickReference
如下填充：
onclickReference=$（this.find（“a”）。因此，
addEventListener
抛出非函数错误。如果我引用
$（this.find（“a”）[0]我的数据似乎不存在，我没有意识到
onclickReference
是一个jQuery对象。在这种情况下，它只是
onclickReference.click（function（）{…}）。这不起作用，因为我正在迭代一组“a”元素，其中每个事件侦听器的originReference和objArray的值都会发生变化。在这种情况下，在我的click事件中传递给函数的所有变量的值都将是最终值。我需要它在迭代过程中根据值进行更改。