通过javascript脚本动态为table插入行显示的问题
flysheet
2009-04-11
<table id="leaveWordList" width="100%" cellspacing="0"> <tr id=""> <td class="leaver"> <a href="#" style="text-align: center;"> <img class="leaverImg" src="./images/user_image.jpg" /> </a> </td> <td class="leavewordContent"> <p>test</p> </td> <td class="lwOptions"> <p class="displayDate">2009-04-04 12:44</p> <p><a class="replyLeaveWord" href="#">回复</a><a onclick="deleteLeaveword()" href="#">删除</a></p> </td> </tr> </table> .replyLeaveWord { margin-right: 5px; padding-right: 5px; border-right: 1px solid #CCC; } .leaverImg { border: 1px solid #CCC; width: 55px; height: 55px; } .leavewordContent { vertical-align: top; padding-top: 15px; padding-left: 10px; border-bottom: 1px solid #6CF; } .lwOptions { padding-top: 15px; border-bottom: 1px solid #6CF; width: 100px; text-align: right; vertical-align: top; } .leaver { padding-top: 15px; width: 55px; text-align: center; } 在IE/Firefox下上面内容显示都是正常的,但一旦通过javascript动态添加一行跟上面一样的,Firefox还是显示正常,但新增加的一行在IE下却显示不正常了,原本leavewordContent应该顶端对齐却居中对齐了包括其它单元格的对齐方式都没按我在样式表设置的方式对齐 var leavewordTable = document.getElementById("leaveWordList"); var leavewordTr = leavewordTable.insertRow(0); var leaverTd = leavewordTr.insertCell(0); var leaverwordContentTd = leavewordTr.insertCell(1); var leavewordOptionsTd = leavewordTr.insertCell(2); leaverTd.setAttribute("class", "leaver"); leaverTd.innerHTML = "" + "" + ""; leaverwordContentTd.setAttribute("class", "leavewordContent"); leaverwordContentTd.innerHTML = "test"; leavewordOptionsTd.setAttribute("class", "lwOptions"); leavewordOptionsTd.innerHTML = "2009-04-04 12:44" + "回复删除"; 有没有谁清楚,帮忙解决一下,我都快被搞疯了 |
|
flysheet
2009-04-11
很抱歉,比较急,没把HTML放上去,有谁知道,帮忙一下,初次学习,大家多多指教,不知自己上面描述是否说明白
|
|
jasstion
2009-04-12
你说的不是很清楚?你说新增加的一行?值得是什么?你是不是用到了Ajax技术,异步调用服务端的信息然后通过JavaScript处理在现实到客户端网页上?
|
|
flysheet
2009-04-13
解决了,出现显示样式问题是由于IE通过setAttribute("class", className)是不起作用的,而需要把class改成className才可以,谢谢大家对帖子关注。
问题解决了! |