Question

jquery动态表格

我要使用jquery或者纯javascript代码实现以下功能：
1.在我选择不同的作业时， 我已经使用dwr框架从后台获得了所有的可以发布改作业的班级信息
2.我需要将班级信息除了表头以外全部清除掉， 然后重新生成新的TR 并带上dwr框架获取的数据。求大神帮忙解决。
部分代码：
//获取数据的dwr代码
function loadClasses(reqIdObj){
var reqId =reqIdObj.value;
var teachId =document.getElementById("teachId").value;
// alert(requId+":"+teachId);
workrequireAction.loadClasses(reqId,teachId,callbackLoadClasses);
}
function callbackLoadClasses(data){
var classes =eval(data);
var dataTable =document.getElementById("dataTable");
$("#dataTable tr").remove();
// for(i=0;i<classes.length;i++){
// var tr=document.createElement("TR");
// }
}
//需要操作的table表

<table class="query_form_table" id="dataTable">
<tr>
<th width="10%">选择</th>
<th width="10%" >班级编号</th>
<th width="20%">所属系部</th>
<th width="20%">班级名称</th>
</tr>
<tr>
<td align="center"><input type="checkbox"/></td>
<td valign="middle" align="center">b0001</td>
<td valign="middle" align="center">商学部</td>
<td valign="middle" align="center">商0903班</td>
<tr>

</table>

Answer 1

$("#dataTable tr").remove(); <- 亲，你用了jQuery吗，你这个东西对jQuery来说不要太简单好不好。

你的dataTable不对，应该这样写

<table class="query_form_table"  id="dataTable">
<thead>
    <tr>
   <th width="10%">选择</th>
  <th width="10%" >班级编号</th>
  <th width="20%">所属系部</th>
  <th width="20%">班级名称</th>
 </tr>
</thead>
<tbody>
 <tr>
  <td   align="center"><input  type="checkbox"/></td>
  <td  valign="middle" align="center">b0001</td>
  <td  valign="middle" align="center">商学部</td>
  <td  valign="middle" align="center">商0903班</td>
 <tr>
</tbody>
</table>

然后回调函数内部直接写

var classes = eval(data);
var tbody = $('#dataTable tbody');
tbody.empty();
for(i=0; i < classes.length; i ++) {
    var tr = $('<tr><td>...</td></tr>');
    tbody.append(tr);
}

完事

Answer 2

思路如下（jquery）：
在表头 th tr 里面加一个class ，每次 下拉 option ： change事件后 清空 td tr 行，然后通过each（）循环产生 新的班级行数，然后把生成的行 append 到 table 里面
也可以直接把table清空（empty()），产生新数据的时候加上表头部分。

自己动手，丰衣足食，祝成功