javascript - 动态生成html和js，生成意外的引用

Question

我有这个代码:

htmlStr+="<div class='list-group-item Specification' " +
"onClick=displayResults(" + key + ", '" + time + 
"', '" + fieldevents +     
"')>";

在 Chrome 调试器中它会生成我想要的 html，其中

onclick=displayResults(1, '14:03', 'shotput, highjump, longjump')>

但在元素选项卡中我看到生成的 html 是

"onclick=displayResults(1," '14:03', 

...第一个逗号后面的双引号来自哪里？我正在使用 chrome 顺便说一句

Answer 1

当属性值包含空格时，需要用引号引起来。否则，空格结束该值。

htmlStr+="<div class='list-group-item Specification' " +
"onClick=\"displayResults(" + key + ", '" + time + 
"', '" + fieldevents +     
"')\">";