动态插入表格

最新推荐文章于 2022-02-25 18:19:43 发布

testzhq426

最新推荐文章于 2022-02-25 18:19:43 发布

阅读量93

点赞数

分类专栏： web 文章标签： JavaScript C C++ C# HTML ViewUI

本文链接：https://blog.csdn.net/testzhq426/article/details/83427530

版权

web 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>

		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<script language="javascript">
    function add() {
        var mytable = document.getElementById("propertyTable");
        var row = mytable.insertRow();
        row.align = "center";

        var s1 = '<td align=\"center\" ><input  type=\"input\" name=\"columnName\" style=\"width:100%\" ></td>';
        var s3 = '<td align=\"center\" ><input  type=\"input\" name=\"columnDescription\" style=\"width:100%\"></td>';
        var s4 = '<td align=\"center\"><input type=\"checkbox\" name=\"columnIdt\" value=\"\" ><input type=\"hidden\" name=\"columnId\" value=\"0\"></td>';

        var temsel1 = row.insertCell()
        temsel1.innerHTML = s1;
        var temsel3 = row.insertCell();
        temsel3.innerHTML = s3;
        var temsel4 = row.insertCell();
        temsel4.innerHTML = s4;
    }

    function del() {
       var mytable = document.getElementById("propertyTable");
        var c = document.getElementsByName("columnIdt");
        var count = c.length;
        for (var i = 0; i < count; i++) {
            if (c[i].checked) {
                mytable.deleteRow(i + 1);
                i--;
                count--;
            }
        }
    }
</script>
	</head>
	<body>
		<table align=center>
			<tr>
				<td height="16">
					<!-- 扩展属性增加 -->
					<table width="100%" border="0" cellpadding="0" cellspacing="0" >
						<tr>
							<td align="left" class="top-left-esp1-6"> &nbsp; </td>
							<td class="top-center-esp1-6" noWrap> 扩展信息 </td>
							<td align="right" noWrap>
								<a href="javascript:add()">添加明细</a> |
								<a href="javascript:del()">删除明细</a>
							</td>
							<td align="right"> &nbsp; </td>
							<td></td>
						</tr>
					</table>
				</td>
			</tr>
			<tr>
				<td>
					<table id="propertyTable" width="100%" border=1
						bordercolor="#abcd00" style="border-collapse: collapse"
						class="table-line">
						<tr bgcolor="">
							<td align="center" class="title-line01" width="20%"> 属性名 </td>
							<td align="center" class="title-line01" width="30%"> 属性值 </td>
							<td align="center" class="title-line01" width="10%"> 选择 </td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
		<!-- 扩展属性增加 end -->
	</body>
</html>

testzhq426

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
动态插入表格

&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt;&lt;html&gt; &lt;head&gt; &lt;meta http-equiv="keywords" content="keyword1,keyword2,keyword3"&gt; &lt;meta ht
复制链接

扫一扫

专栏目录