js清空table，-Java教程-爱易网页

js清空table，

日期：2014-05-17　浏览次数：20804 次

js清空table，急！在线等！
图片：
代码：

Java code


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<html>
<head>
<script type="text/javascript">
function contactlist(){
        var table = document.getElementById("contactTable");
        var tr = table.insertRow(table.rows.length);//添加一行
        tr.align="center";
        tr.bgcolor="#F3F4F3";
        tr.height="23";

        //添加五列
        var td0 = tr.insertCell(0);
        td0.width="20%";
        var td1 = tr.insertCell(1);
        td1.width="20%";
        var td2 = tr.insertCell(2);
        td2.width="8%";
        var td3 = tr.insertCell(3);
        td3.width="30%";
        var td4 = tr.insertCell(4);
        td4.width="20%";
        
        //设置列内容
        td0.innerHTML = "";
        td1.innerHTML = "<input type='file' id='dataAudio' name='dataAudio'/><input type='hidden' name='dataAudios'/><input type='hidden' name='audioOldName'/>";
        td2.innerHTML = "<input type='text' name='playDateTime' id='playDateTime' onkeyup='validateNumber(this);' size='5' maxlength='3' style='color: red' />";
        td3.innerHTML = "<input type='text' name='content' id='content' size='35' maxlength='300'/>";
        td4.innerHTML = "<input type='button' value='删除' onclick='removeRow(this.parentNode.parentNode)'/>";
        
    }

function removeRow(r)
{
    var root = r.parentNode;
    var allRows = root.getElementsByTagName('tr');
    if(allRows.length > 3){
        root.removeChild(r);
    }else{
        alert("不能删除改行！");
    }
}
</script >
</head>


<body>

<table id="contactTable" width="98%" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#D9D9D9"> 
        <tr bgcolor="#F3F4F3" align="center" height="23">
           <td colspan="5" align="left"><input type="button" value="添加帧" class="button" onclick="return contactlist();"/></td>
        </tr>
        <tr bgcolor="#F3F4F3" align="center" height="23">
           <td width="20%">上传图片</td>
           <td width="20%">上传声音</td>
           <td width="8%">播放时间</td>
           <td width="30%">内    容</td>
           <td width="20%">操作</td>
        </tr>
    </table>

</body>
</html>

问题：现在点击每行的删除按钮可以一行一行的删除，我想要的是点击一个按钮清空table（即一下把那三行都删除，单表头要留着，当然也可能n行）

------解决方案--------------------

HTML code



<html>
<head>
<script type="text/javascript">
function contactlist(){
        var table = document.getElementById("contactTable");
        var tr = table.insertRow(table.rows.length);//添加一行
        tr.align="center";
        tr.bgcolor="#F3F4F3";
        tr.height="23";

        //添加五列
        var td0 = tr.insertCell(0);
        td0.width="20%";
        var td1 = tr.insertCell(1);
        td1.width="20%";
        var td2 = tr.insertCell(2);
        td2.width="8%";
        var td3 = tr.insertCell(3);
        td3.width="30%";
        var td4 = tr.insertCell(4);
        td4.width="20%";
        
        //设置列内容
        td0.innerHTML = "";
        td1.innerHTML = "<input type='file' id='dataAudio' name='dataAudio'/><input type='hi

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

js清空table，

相关资料更多>

推荐阅读更多>