javascript - 将字符串值传递给动态创建的 HTML 元素

Question

我有 Array msg 我想将它传递给 html 中动态创建的元素的 onclick 函数。

for(var i=0; i < msg.length ; i++){

 categoryList += "<img src='../products/"+msg[i].imgurl+"' class='slide_contain' onclick='getCanvas("+msg[i].id+","+msg[i].shape+","+msg[i].height+","+msg[i].width+","+msg[i].topval+","+msg[i].leftval+","+msg[i].radius+","+msg[i].subcat+","+msg[i].imgurl+")'/>";
    categoryList += "<li> <span> "+msg[i].imgurl+"</span></li>";
}

检查时我看到：

<img src="../products/Lighthouse.jpg" class="slide_contain" onclick="getCanvas(2,3,100,100,100,210,100,1,Lighthouse.jpg)">

这里最后一个字符串变量没有正确传递？？怎么做 ？或者否则我如何将 msg Array 传递给函数并在函数中获取值？

Answer 1

你错过了引号..

 categoryList += "<img src='../products/"+msg[i].imgurl+"' class='slide_contain' onclick='getCanvas("+msg[i].id+","+msg[i].shape+","+msg[i].height+","+msg[i].width+","+msg[i].topval+","+msg[i].leftval+","+msg[i].radius+",'"+msg[i].subcat+"')'/>";

Answer 2

尝试这样的事情

categoryList += '<img src="../products/'+msg[i].imgurl+' class="slide_contain" onclick="getCanvas('+msg[i].id+','+msg[i].shape+','+msg[i].height+','+msg[i].width+','+msg[i].topval+','+msg[i].leftval+','+msg[i].radius+','+msg[i].subcat+',\''+msg[i].imgurl+'\')"/>';

Answer 3

以这种方式传递最后一个参数 ==>

  \'' msg[i].subcat  '\' 
 categoryList += "<img src='../products/"+msg[i].imgurl+"' class='slide_contain' onclick='getCanvas("+msg[i].id+","+msg[i].shape+","+msg[i].height+","+msg[i].width+","+msg[i].topval+","+msg[i].leftval+","+msg[i].radius+",' \''"+msg[i].subcat+"'\' ')'/>";

输出

'Lighthouse.jpg'