Question

添加<li>的正确语法有很多结果，但我正在尝试找到+this['name']+中包含<li>值的解决方案。 firebug正在显示'SyntaxError: unterminated string literal'，jslint正在显示'Unclosed string'。我已尝试过逗号的多个不同版本，但我无法让它工作。

 $.each(data.result, function() {
     $("ul").append("<li>Name: "+this['name']+"</li>
                     <li>Age: "+this['age']+"</li>
                     <li>Company: "+this['company']+"</li>
                     <br />");
 });

谢谢。

Answer 1

您可以使用反斜杠字符\转义行尾，如下所示：

 $.each(data.result, function(){
 $("ul").append("<li>Name: " + this['name'] + "</li> \
     <li>Age: " + this['age'] + "</li> \
     <li>Company: "+this['company']+"</li> \
     <br />");
 });

这是因为Javascript会在某一行自动插入半列。在这种情况下，你的字符串不是很接近。另一个解决方案是关闭每一行上的每个字符串，并使用+将它们连接起来。

 $.each(data.result, function(){
 $("ul").append("<li>Name: " + this['name'] + "</li>" +
     "<li>Age: " + this['age'] + "</li>" +
     "<li>Company: "+this['company']+"</li>" +
     "<br />");
 });

（不相关，但<br/>元素中不允许<ul>

Answer 2

这应该快得多

 li = '';
 $.each(data.result, function(){
     li += "<li>Name: " + this['name'] + "</li>" +
          "<li>Age: " + this['age'] + "</li>" +
          "<li>Company: "+this['company']+"</li>" +
          "<br />"; // could remove this and use css
 });

 $("ul").append(li);

请参阅http://net.tutsplus.com/tutorials/javascript-ajax/10-ways-to-instantly-increase-your-jquery-performance/

Answer 3

你实际上根本不想连接这个！考虑一下包含HTML或类似HTML的数据的变量数据会发生什么。使用您的方法，它将被解析，可能会破坏事物甚至打开您的XSS攻击方法。

你已经在使用jQuery了，所以正确的方法很简单：

$('ul').append(
    $('<li/>').text('Name: ' + this.name), 
    $('<li/>').text('Age: ' + this.age),
    // etc.
);

（注意：我相信.append() allows as many parameters as you give it。如果没有，请在追加时尝试使用元素数组。）

如何在javascript中连接多行字符串？

3 个答案: