Question

我在JS里面有以下代码：

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

填充var并发送以下结果（从源视图）：

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

我无法弄清楚为什么 href 属性中的那个没有正确插入...

更新：在我的最后评论中回答。

Answer 1

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

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);

使用动态数据填充字符串

1 个答案: