在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那里。但我不知道该怎么做。根据查询的结果,表格的每一行都有一些确定点的列。
我该怎么做?
答
对于这种情况,您不需要插入脚本标签,您可以在同一功能中完成所需的任何操作。
$(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>
让我看看,如果我理解这一点,你想在'quant_colums'索引显示在标签? – Adjit
ES5不支持多行字符串文字。你可以使用ES6字符串插值。 – MinusFour
@Adjit Hun是的,实际上把一个数字输入类型 –