在Jquery $()。append()中插入javascript代码。

问题描述:

我有如下代码:

for (var key in returns) {    
    $('#tBodyTable').append('\ 
     <tr>\ 
      <td >\ 
       <label>'+ returns[key].name +'</label>\ 
      </td>\ 
      <script>\ 
       for (var i in quant_colums){\ 
        document.write("<td ><center><label>a</label></center></td>");\ 
       };\ 
      </script>\ 
     </tr>\ 
    '); 
}; 

此代码是jQuery的阿贾克斯return内部,第一循环覆盖body动态表。 T 他的第二个循环是为创建<td>动态地基于变量的值quant_columns,这就是为什么有一个JavaScript那里。但我不知道该怎么做。根据查询的结果,表格的每一行都有一些确定点的列。

我该怎么做?

+0

让我看看,如果我理解这一点,你想在'quant_colums'索引显示在标签? – Adjit

+1

ES5不支持多行字符串文字。你可以使用ES6字符串插值。 – MinusFour

+0

@Adjit Hun是的,实际上把一个数字输入类型 –

对于这种情况,您不需要插入脚本标签,您可以在同一功能中完成所需的任何操作。

$(function(){ 
 

 
    var returns = {t1: {name:'teste1'},t2:{name:'teste2'},t3:{name:'teste2'}}; 
 
    var quant_colums = 3; 
 

 
    var $table = $('#tBodyTable'); 
 

 
    for (var key in returns) {  
 
     var $tr = \t '<tr>\ 
 
\t \t \t \t \t \t <td >\ 
 
        \t \t <label>'+ returns[key].name +'</label>\ 
 
       \t \t </td>\ 
 
      \t \t </tr>'; 
 
     
 
     for (var i in quant_colums){ 
 
      $tr.append("<td ><center><label>a</label></center></td>"); 
 
     } 
 
     $table.append($tr); 
 
    }; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> 
 
<table id="tBodyTable"></table>

+0

感谢@alexqoliveira,这个逻辑工作:) –

可以使用DOM中插入动态基于你有这样的数据元素。

var returns, quant_colums, tbody; 
 

 
returns = { 
 
    a: {name: "a"}, 
 
    b: {name: "b"}, 
 
    c: {name: "c"} 
 
}; 
 

 
quant_colums = [0, 1, 2, 3]; 
 

 
tbody = window.document.querySelector("#tBodyTable"); 
 

 
Object.keys(returns).forEach(function (key) { 
 
    var row, cell; 
 

 
    row = tbody.insertRow(); 
 

 
    cell = row.insertCell(); 
 
    cell.innerHTML = '<label>' + returns[key].name + '</label>'; 
 

 
    quant_colums.forEach(function (i) { 
 
    cell = row.insertCell(); 
 
    cell.innerHTML = "<center><label>" + i + "</label></center>"; 
 
    }); 
 
});
<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <meta charset="UTF-8"> 
 
     <script src="script.js"></script> 
 
    </head> 
 
    <body> 
 
     <table> 
 
      <tbody id="tBodyTable"></tbody> 
 
     </table> 
 
    </body> 
 
</html>