我正在尝试动态添加并填充一些选择框：
$("#mydiv").append("<table id='myTab'><tr></tr></table>")
var row = "";
for (var i = 0; i < 3; i++) {
row += "<select id='sel" + i + "'>";
for (var j = 0; j < 3; j++) {
row += "<option id='opt" + j + "'>Test " + j + "</option>";
}
row += "</select>";
$("#mydiv").on('change', '#sel' + i, function() {
alert($(this).val());
});
}
$("#mytab").append(row);
不幸的是，选择框不会显示。
但是，当我输出时row，我得到了预期的输出：
<select id='sel0'>
<option id='opt0'>Test 0</option>
<option id='opt1'>Test 1</option>
<option id='opt2'>Test 2</option>
</select>
<select id='sel1'>
<option id='opt0'>Test 0</option>
<option id='opt1'>Test 1</option>
<option id='opt2'>Test 2</option>
</select>
<select id='sel2'>
<option id='opt0'>Test 0</option>
<option id='opt1'>Test 1</option>
<option id='opt2'>Test 2</option>
</select>
只需更换...
$("#mytab").append(row);
... 和 ...
$("#myTab").append(row);
$("#mydiv").append("<table id='myTab'><tr></tr></table>")
var row = "";
for (var i = 0; i < 3; i++) {
row += "<select id='sel" + i + "'>";
for (var j = 0; j < 3; j++) {
row += "<option id='opt" + j + "'>Test " + j + "</option>";
}
row += "</select>";
$("#mydiv").on('change', '#sel' + i, function() {
alert($(this).val());
});
}
$("#myTab").append(row);table {
border: 1px solid;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div id="mydiv">
</div>（另请参阅此小提琴）
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句