2016-01-22 106 views
0

我有下面的代码线的内侧箱填充字符串JS:与动态数据

'<a class="txt333 clps" data-toggle="collapse" aria-expanded="false" '+ 
    'href="#collapse_reqConf'+sent+'" '+ 
    'aria-controls="collapse'+sent+'" '+ 
    'data-parent="#accordion_reqConf'+sent+'">' 

哪个填充变种发送和产生以下结果(从源视图):

<a class="txt333 clps" data-parent="#accordion_reqConf137" aria-controls="collapse137" href="#collapse_reqConf'+sent+'" aria-expanded="false" data-toggle="collapse"> 

我不能找出为什么一个属性没有被正确插入...


更新:我最后的评论中的工作答案。

+0

该字符串格式正确。 [必须有其他事情。](https://jsfiddle.net/4ooh2soa/) –

+0

似乎没问题:https://jsfiddle.net/DinoMyte/uwsutrz7/2/ – DinoMyte

+0

工作也适合我。 –

回答

1

由于您正在使用jQuery,因此您可以尝试使用jQuery来创建DOM元素。就我个人而言,我觉得使用HTML字符串创建元素很容易出错,使代码很难读取和调试。我创建了使用jQuery时遇到问题的<a></a>元素,并使用从字符串创建的元素追加其包含的元素。

var inner = '<div class="row">'+ 
       '<div class="col-xs-9 col-sm-8">'+ 
        '<table class="w100p text-success b">'+ 
         '<tr>'+ 
          '<td width="50%" class="nowrap pad10rt">'+ '<i class="fa fa-clock-o fa-lg valignMid xtraSm"></i> 4:00 pm'+'</td>'+ 
          '<td width="50%"><i class="fa fa-user fa-lg valignMid xtraSm"></i> x '+part+'</td>'+ 
         '</tr>'+ 
        '</table>'+ 
       '</div>'+ 
       '<div class="col-xs-3 col-sm-4 text-right">'+ 
        '<i class="indicator fa fa-fw fa-chevron-right"></i>'+ 
       '</div>'+ 
      '</div>'; 


var attribs = { 
    "class": "txt333 clps", 
    "data-toggle": "collapse", 
    "aria-expanded": false, 
    "href": "#collapse_reqConf" + sent, 
    "aria-controls": "collapse" + sent, 
    "data-parent": "#accordion_reqConf" + sent 
}; 


var elStr = $('<a>').attr(attribs).append($(inner)).prop('outerHTML'); 
console.log(elStr);