Question

我想在更改select时动态添加表行我已经编写了一个实际执行此操作的脚本，但系统尚未动态。

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">

$(document).ready(function(){
$("#noOfSegments").change(function(){
    var counter=${#noOfSegments}.val();
    for(i=0; i<counter; i++){
    var row = $("<tr><td>"i"</td><td>"i"</td><td>"i"</td><td>"i"</td><td>"i"</td></tr>");
    $("#segmentTable").append(row);
    }
});
});
</script>

<select id="noOfSegments">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

和#segmentTable是我的表ID 但上面的脚本给了我这个错误：

“未捕获的SyntaxError：意外的令牌{”

有人可以建议我一个解决方案吗？

Answer 1

你遗漏了很多括号，引号和加号。这应该有效：

$(document).ready(function(){
$("#noOfSegments").change(function(){
    var counter=$('#noOfSegments').val();
    for(i=0; i<counter; i++){
    var row = $("<tr><td>" + i + "</td><td>" + i + "</td><td>" + i + "</td><td>" + i + "</td><td>" + i + "</td></tr>");
    $("#segmentTable").after(row.html());
    }
});
});

Answer 2

DEMO

更正后的代码和

更改了$("#segmentTable").after(row.html())

到

$("#segmentTable").html(row.html());

$(document).ready(function () {
    $("#noOfSegments").change(function () {
        var counter = $('#noOfSegments').val();
        for (i = 0; i < counter; i++) {
            var row = $("<tr><td>" + i + "</td><td>" + i + "</td><td>" + i + "</td><td>" + i + "</td><td>" + i + "</td></tr>");
            $("#segmentTable").html(row.html());
        }
    });
});

Answer 3

将${#noOfSegments}更改为$('#noOfSegments')。

Answer 4

在java脚本中，您可以动态地执行

var table = document.createElement("table");
table.id = "tbldrp";
var row = table.insertRow(table.rows.length);
var rowItems = row.insertCell(0);
var label = document.createElement("label");
label.id = "lblDripName";
label.innerHTML = "Label Content";
rowItems.appendChild(label);

jQuery动态添加表行

4 个答案: