Question

我需要为每个数据构建一个动态字符串。该字符串将设置一个HTML按钮，当事件单击将调用一个函数。我遇到'e'问题。请参阅以下示例：

var stringButton = ""; 
var txtBtn = "My Button";
for(item in data){
     stringButton= "<input id='btn-" + item.id + "' type='button' href='#'
class='fbbutton'" + "value=' " + txtBtn + "' onclick='actionBtn(" + item .id + ", '" + 
item .name + "')'>";
}

function actionBtn(id, name) {
//process data.
}

在检查元素中，我看到：

<input id="btn-1599" type="button" href="#" class="fbbutton" value=" My Button " 
onclick="actionBtn(1599, " itemName"" jjjj')'="">

问题是创建调用方法传递参数字符串的字符串。我们可以看到，“和'是错的。正确的方法是什么？

Answer 1

IMO正确使用DOM创建方法并正确绑定事件处理程序而不是使用内联事件处理程序。

var button = document.createElement('input');
button.id = item.id;
button.type = "button";
button.className = "fbbutton";
button.value = txtBtn;
button.onclick = (function(item) {
    return function() {
        actionBtn(item.id, item.name);
    };
}(item));

Answer 2

你的item.name肯定有'或'，所以它会剪掉你正在构建的字符串。

尝试逃避它们

Answer 3

要么像Felix Klings一样回答，要么如果你要这么做，请使用javascript模板/微模板。

https://developer.mozilla.org/en/JavaScript_templates

Answer 4

DOM检查器在解析器处理完DOM后向您显示DOM。它没有向您显示原始来源。诸如“使用了什么样的引号”，“属性的顺序”，“属性之间有多少空格字符”之类的东西都没有保留。

在这里，您看到所有属性都包含在双引号中，但它们也包含双引号。但是你也会注意到值中的那些颜色编码为字符串的一部分（通常为蓝色）。

那就是说，在你的来源中，你是围绕属性值的单引号和它内部的单引号。请考虑使用双引号代替其中一个（在此处转义为\"）或"实体。

最后，欢迎使用Stack Overflow。在询问新问题之前，请接受以前问题的答案。

Javascript构建动态字符串

4 个答案: