62,243
社区成员
发帖
与我相关
我的任务
分享一个关于js自定义创建表格清除的问题？
<html>
<input type="button" value="查询" id="btn_code_query" style="width:60px" />
<div id="show_choose_row" style="margin-top:20px;display:none">
<table>
<tr>
<td>
<input id="Checkbox6" type="checkbox" value="订单编号"/> 订单编号
</td>
<td>
<input id="Checkbox7" type="checkbox" value="流水线编码"/> 流水线编码
</td>
<td>
<input id="Checkbox8" type="checkbox" value="库位类型"/> 库位类型
</td>
<td>
<input id="Checkbox9" type="checkbox" value="产品名称"/> 产品名称
</td>
<td>
<input id="Checkbox10" type="checkbox" value="单板数目"/> 单板数目
</td>
</tr>
<tr>
<td>
<input id="btn_confirm" type="button" value="确认" />
</td>
<td>
<input id="btn_full_Check" type="button" value="全选" />
</td>
<td>
<input id="btn_cleardate" type="button" value="清空" />
</td>
</tr>
</table>
</div>
<div>
<table id="date_List" >
</table>
</div>
</html>
以下我的js
<script type="text/javascript">
$(document).ready(function () {
//生成数据表格
$("#btn_code_query").click(function () {
chbox();
});
})
//该函数主要是得到我页面选择的标签
function chbox() {
var sign = 0;
var inputs = document.getElementsByTagName('input');
//获取所有的input标签对象。
var Hidden = document.getElementById('CheckBox_Value').value;
var table = document.getElementById("date_List");
for (var i = 0; i < inputs.length; i++) {
var obj = inputs[i];
if (obj.type == 'checkbox') {
if (obj.checked == true) {
var th = document.createElement("th");
th.innerHTML =obj.value
table.appendChild(th);
}
}
}
}
现在的问题是，我再次去选择CheckBox并点击btn_code_query按钮，不要去重复的加th表头。可是每次都重复了，如何去清除。清除后，根据重新选择的CheckBox。才生成我想要的table。
<input type="button" value="查询" id="btn_code_query" style="width:60px" />
<div id="show_choose_row" style="margin-top:20px;display:none">
<table>
<tr>
<td>
<input id="Checkbox6" type="checkbox" value="订单编号"/> 订单编号
</td>
<td>
<input id="Checkbox7" type="checkbox" value="流水线编码"/> 流水线编码
</td>
<td>
<input id="Checkbox8" type="checkbox" value="库位类型"/> 库位类型
</td>
<td>
<input id="Checkbox9" type="checkbox" value="产品名称"/> 产品名称
</td>
<td>
<input id="Checkbox10" type="checkbox" value="单板数目"/> 单板数目
</td>
</tr>
<tr>
<td>
<input id="btn_confirm" type="button" value="确认" />
</td>
<td>
<input id="btn_full_Check" type="button" value="全选" />
</td>
<td>
<input id="btn_cleardate" type="button" value="清空" />
</td>
</tr>
</table>
</div>
<div>
<table id="date_List" >
</table>
</div>
</html>
以下我的js
<script type="text/javascript">
$(document).ready(function () {
//生成数据表格
$("#btn_code_query").click(function () {
chbox();
});
})
//该函数主要是得到我页面选择的标签
function chbox() {
var sign = 0;
var inputs = document.getElementsByTagName('input');
//获取所有的input标签对象。
var Hidden = document.getElementById('CheckBox_Value').value;
var table = document.getElementById("date_List");
for (var i = 0; i < inputs.length; i++) {
var obj = inputs[i];
if (obj.type == 'checkbox') {
if (obj.checked == true) {
var th = document.createElement("th");
th.innerHTML =obj.value
table.appendChild(th);
}
}
}
}
现在的问题是，我再次去选择CheckBox并点击btn_code_query按钮，不要去重复的加th表头。可是每次都重复了，如何去清除。清除后，根据重新选择的CheckBox。才生成我想要的table。
...全文
请发表友善的回复…
发表回复
md5e 2014-01-22
- 打赏
- 举报
一般一个完整的Table是这样的
<table>
<thead>
<!--这里是表头-->
</thead>
<tbody>
<!--这里是内容区-->
</tbody>
</table>
但有些人为了途简便，常常将表头与内容混在一起写
jQuery("table>tbody")//获取内容对象
