Javascript构建动态字符串

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.
}

在inspect元素中，我看到：

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

问题是创建字符串，它调用传递参数字符串的方法。正如我们所看到的，“and‘是错误的。正确的方法是什么？”

Answer 1

在解析器处理完DOM之后，DOM检查器会向您显示DOM。它不会显示原始源代码。诸如“使用了哪种类型的引号”、“属性的顺序是什么”、“属性之间有多少空格字符”之类的内容不会被保留。

在这里，您可以看到所有属性都用双引号括起来，但它们也包含双引号。但您也会注意到，值中的值被颜色编码为字符串的一部分(通常为蓝色)。

也就是说，在源代码中，您在属性值两边使用了单引号，并在其中使用了单引号。考虑使用双引号来代替其中之一(在这里转义为\" )，或者使用"实体。

最后，欢迎来到Stack Overflow。请先接受先前问题的答案，然后再提出新问题。

Answer 2

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 3

在您的item.name中肯定有一个‘或’，所以它切断了您正在构建的字符串。

试着逃离他们