Question

在这个页面上，我有一个表格，可以输入有关给定名单上学生的信息。每个学生都列在一个带有下拉框和注释字段的表格中。每个学生都有一个“添加另一个”按钮，因此如果用户想要输入关于学生的第二个注释，他们就可以。

点击该按钮启动此javascript功能：

var counter=1;
function multipleDemerits(studentID) {
counter++;
var anotherDemeritRow = "<select name='behavior_"+studentID+"_"+counter+"'><option value=0>Select  --></option><option value=0></option><option value=0>1 demerit behaviors</option><option value=1>&nbsp;&nbsp;unprepared</option><option value=2>&nbsp;&nbsp;incomplete hw</option><option value=3>&nbsp;&nbsp;electronics/phone</option><option value=4>&nbsp;&nbsp;uniform</option><option value=5>&nbsp;&nbsp;talking/making noise</option><option value=0></option><option value=0>2 demerit behaviors</option><option value=6>&nbsp;&nbsp;tardy</option><option value=7>&nbsp;&nbsp;wasting time</option><option value=8>&nbsp;&nbsp;food/gum</option></select>&nbsp;&nbsp;Comments: <input name='comments_"+studentID+"_"+counter+"' type='text' size='30' maxlength='100'/><br />&nbsp;";
document.getElementById(studentID).innerHTML += anotherDemeritRow;
}

新的下拉菜单和评论字段在Mac浏览器中完美显示，但在Windows Firefox或IE中则不然。当前表行的高度不会增加，因此附加字段开始与表中的其余行重叠。不是我想要的。

来自Windows浏览器专家的任何想法？谢谢！

更新：改为jQuery的附加......没有区别。但是，如果我在函数的最开头添加一个警告语句，它现在可以工作。咦？！？！

Answer 1

我认为你应该使用'append()'代替'innerHTML'，因为它解决了firefox和IE中的一些表渲染问题。

Answer 2

你能尝试让表格行显示块吗？这可能会确定高度。

Windows firefox是否报告了该页面的任何问题？

在表中动态添加更多表单域不会调整行的高度

2 个答案: