jQuery .append()方法,IE8中的奇怪行为

时间:2011-06-22 16:43:49

标签: jquery

所以我试图在javascript中动态构建一个表,我已经加载了jQuery库,所以我选择使用它的append方法,因为它易于使用并且很容易找到我的div。

这适用于FireFox和Chrome但在IE8中失败(在IE8中没有错误,表格没有显示)

$("#weatherFeed").append('<table class=\"weather\"><tr>');
for (var i = 0; i < 7; i++) {
    $("#weatherFeed").append('<td>a</td>');
}
$("#weatherFeed").append('</tr><tr>');
for (var i = 0; i < 7; i++) {
    $("#weatherFeed").append('<td>b</td>');
}
$("#weatherFeed").append('</tr></table>');

然而,这三种情况都很好:

$("#weatherFeed").append('<table class=\"weather\"><tr><td>wth</td><td>wth</td>'
+ '<td>wth</td><td>wth</td></tr><tr><td>wth</td><td>test</td><td>test</td>'
+ '<td>test</td></tr><tr><td colspan=\"4\">MOOSE BALLS</td></table>');

这是我们的企业内部网,99%的用户都在使用IE8。我是javascript和jQuery的新手,但我很肯定我可以找到另一种方法来实现这个目标我只是想它应该工作所以也许我'做错了。

2 个答案:

答案 0 :(得分:0)

jQuery会自动执行结束标记,因此您无需自己执行此操作 你还应该附加到表格而不是div。

请改为尝试:

var table = $('<table class=\"weather\">');
$("#weatherFeed").append(table);

var tr = $('<tr>');
table.append(tr);
for (var i = 0; i < 7; i++) {
    tr.append('<td>a</td>');
}

tr = $('<tr>');
table.append(tr);
for (var i = 0; i < 7; i++) {
    tr.append('<td>b</td>');
}

请参阅小提琴:http://jsfiddle.net/maniator/cUkFa/

答案 1 :(得分:0)

我建议您在调试器中单步执行代码。您可以通过点击F12并转到“脚本”选项卡在IE中启用它。一旦你在那里,你可以为$(“#weatherFeed”)设置一个手表.html()。在IE7模式下,我在第一个TD附加后停止了,我发现手表显示如下:

"<TABLE class=weather>\r\n<TBODY>\r\n<TR>\r\n<DIV></DIV></TR></TBODY></TABLE>\r\n<TD>a</TD>"

这告诉我标签正在为您关闭,并且在初始TABLE和TR之后的任何后续附加都出现在您尝试创建的表之外。