通過onclick屬性將javascript數組傳遞給函數

Question

我正在從一個json文件動態地生成一些帶有循環的按鈕，並帶有一個onclick事件，該事件將一些值和一個數組傳遞給函數。

某些操作不起作用，因為單擊按鈕時在控制台中出現通用的“意外標識符”錯誤； 如果我用字符串或數字替換數組，腳本將起作用，這意味着在傳遞數組或數組本身的方式中一定存在錯誤。

這是html輸出的按鈕外觀（為什么有兩個[object object]？）：

<button onclick="myFunction(1,'string',{[object Object],[object Object]})">Click me</button>

產生於

var button = '<button onclick="myFunction('+otherArray.value1+',\''+otherArray.string1+'\',{'+myArray+'})">Click me</button>';

這是在生成按鈕之前數組在chrome控制台中的外觀：

(2) [{…}, {…}]
0: {param1: "1", param2: "text"}
1: {param1: "2", param2: "more text"}
length: 2
__proto__: Array(0)

有什么建議么？ 謝謝

Answer 1

之所以看到[object Object]是因為分配onclick ，對於這些值，將調用toString方法，因此輸出為[object Object] 。

我可以給您的第一個建議是，在這些情況下，您必須分配此類屬性，請使用addEventListener ，而不是以這種方式創建硬編碼的元素。

因此，在您的情況下，例如：

var button = document.createElement("button");        
var t = document.createTextNode("Click me");
button.appendChild(t);
button.addEventListener('click', () => {
  myFunction(otherArray.value1, otherArray.string1, { myArray });
});
// then append the button where you want to