Question

我正在尝试以动态方式创建以下HTML

<p id="address">Name
    <br> City,
    <br> address,
    <br> +9023562567, +91 7023344335
    <br>
    <strong>Potential (MT) :</strong> 4000
</p>

我是这样尝试的

var html= '';

var name = 'Mark' ;
var city = 'California'
var address = 'Losangles';
var phone1 = '9023562567' ;
var phone2 = '7023344335' ;
var mt= 'Potential (MT)' ;
var mtvalue = '4000' ;

 html += '+name+'<br>\n\
                        '+city+',<br>\n\
                        '+address+',<br>\n\
                        +'+phone1+', +'+phone2+'<br>\n\
                        <strong>'+mt+' :</strong> +mtvalue+</p>\n\


 $("#id").html(html);

但是我得到了Uncaught SyntaxError：意外的令牌ILLEGAL

你可以告诉我如何解决这个问题

请原谅这是一个愚蠢的问题。

http://jsfiddle.net/r69bou3n/6/

Answer 1

您无法使用\

在行之间拆分字符串

html += name + '<br>' + city + ',<br>' + address + ',<br>+' + phone1 + ', +' + phone2 + '<br><strong>' + mt + ' :</strong> +mtvalue+</p>';

Demo

修改

您使用错误的选择器添加html：

$('#address').html(html); // ^^^^^^^

Answer 2

<强>第一）您的 ID不正确使用#address

$("#address").html(html);

<强>第二）你的串联html应该是：

 html += name+'<br>\n\'+
 city+',<br>\n\'
                        address+',<br>\n\+'
                        +phone1+', +'
                        +phone2+'<br>\n\<strong>'
                        +mt+' :</strong> +mtvalue+</p>\n\';

Answer 3

您的html字符串错误。试试这个：

var html= '';
var name = 'Mark' ;
var city = 'California'
var address = 'Losangles';
var phone1 = '9023562567' ;
var phone2 = '7023344335' ;
var mt= 'Potential (MT)' ;
var mtvalue = '4000' ;
html += name+'<br>'+city+',<br>'+address+',<br>'+phone1+', '+phone2+'<br><strong>'+mt+' :</strong> '+mtvalue+'</p>';

$("#address").html(html);

DEMO：http://jsfiddle.net/r69bou3n/16/

Answer 4

你在这里有错误：

                <strong>'+mt+' :</strong> +mtvalue+</p>\n\

将其更改为：

                <strong>'+mt+' :</strong> '+mtvalue+'</p>';

你也应该改变

html += '+name+'<br>\n\

与

html += '<p>'+name+'<br>

并删除字符串中的所有\ n \

Answer 5

试试这个，\n  不需要var html= ''; var name = 'Mark' ; var city = 'California' var address = 'Losangles'; var phone1 = '9023562567' ; var phone2 = '7023344335' ; var mt= 'Potential (MT)' ; var mtvalue = '4000' ; html += name+' '+city+', '+address+', +'+phone1+', +'+phone2+' '+mt+' :' +mtvalue+''; $("#address").html(html);。

ActionBar

DEMO

Answer 6

这应该有效，经过测试

var name = 'Mark' ;
var city = 'California'
var address = 'Losangles';
var phone1 = '9023562567' ;
var phone2 = '7023344335' ;
var mt= 'Potential (MT)' ;
var mtvalue = '4000' ;

 var html = name+"<br>"+
            city+",<br>"+
             address+",<br>"+
             phone1+", "+phone2+"<br>"+
             "<strong>"+mt+" :</strong> "+mtvalue+"</p>";


 $("#id").html(html);

Answer 7

    var html= '';

    var name = 'Mark' ;
    var city = 'California'
    var address = 'Losangles';
    var phone1 = '9023562567' ;
    var phone2 = '7023344335' ;
    var mt= 'Potential (MT)' ;
    var mtvalue = '4000' ;

    html += name+'<br>\n\
                    '+city+',<br>\n\
                    '+address+',<br>\n\
                    +'+phone1+', +'+phone2+'<br>\n\
                    <strong>'+mt+' :</strong>' +mtvalue+'</p>\n\
    ';


     $("#address").html(html);

http://jsfiddle.net/r69bou3n/19/

如何动态创建以下HTML

7 个答案: