JavaScript实现表中行的增加和删除

来源：懂视网责编：小采时间：2020-11-27 20:30:45

JavaScript实现表中行的增加和删除

JavaScript实现表中行的增加和删除:<%@ page pageEncoding="UTF-8"%><%@ include file="/common/import.jsp" %> <html> <head> <%@ include file="/common/header.jsp" %> </head> <body leftmargin=0 topmargin=0>

推荐度：

点击下载本文 文档为doc格式

导读JavaScript实现表中行的增加和删除:<%@ page pageEncoding="UTF-8"%><%@ include file="/common/import.jsp" %> <html> <head> <%@ include file="/common/header.jsp" %> </head> <body leftmargin=0 topmargin=0>

<%@ page pageEncoding="UTF-8"%>
<%@ include file="/common/import.jsp" %>

<html>
<head>
<%@ include file="/common/header.jsp" %>

</head>

<body leftmargin=0 topmargin=0>
<table width="100%" border="0" cellpadding="0" cellspacing="0"
align=center border=0>

<tr>
<td height=30></td>
</tr>
<tr>
<td height=10 align=center>
<input type=button name="add" value="新增股东" onclick="addRow();">
<input type=button name="del" value="减少股东" onclick="delRow();">
</td>
</tr>
<tr>
<td valign=top>

<table width="95%" border="1" align="center" cellpadding="1" id="tbl_gd" name="tbl_gd" cellspacing="0" bordercolor="#0099cc" style="line-height: 1.4; border-collapse: collapse" bgcolor="#ffffcc">
<tr>
<td align=center width=30%>股东名称</td>
<td align=center width=30%>证照号码</td>
<td align=center width=20%>出资额</td>
<td align=center width=20%>出资比例(%)</td>
</tr>

<tr>
<td align=left%>
<input name="name1" id="name1" value="">
</td>
<td align=left%>
<input name="cardNo1" id="cardNo1" value="">
</td>
<td align=left%>
<input name="moneyInvested1" id="moneyInvested1" value="">
</td>
<td align=left%>
<input name="percentage1" id="percentage1" value="">
</td>
</tr>

</table>

</td>
</tr>
<tr>
<td height=20></td>
</tr>
<tr>
<td align="center" width="100%"><input type="button"
onClick="save()" value="保存&转入下一步"></td>
</tr>
<tr>
<td> </td>
</tr>

</table>

</body>
<script language=javascript>
function save(){
if(!confirm("确实要保存并转入下一步吗？")){
return;
}
getInfo();
//qy_info.submit();
}
function addRow(){

//添加一行

var newTr = document.getElementById("tbl_gd").insertRow(-1);
var index=newTr.rowIndex;
//alert(index);

//添加四列

var newTd0 = newTr.insertCell(-1);

var newTd1 = newTr.insertCell(-1);

var newTd2 = newTr.insertCell(-1);

var newTd3 = newTr.insertCell(-1);

//设置列内容和属性

newTd0.innerHTML ="<input name=\"name"+index+"\" id=\"name"+index+"\" value=\"\">";

newTd1.innerHTML = "<input name=\"cardNo"+index+"\" id=\"cardNo"+index+"\" value=\"\">";
newTd2.innerHTML = "<input name=\"moneyInvested"+index+"\" id=\"moneyInvested"+index+"\" value=\"\">";
newTd3.innerHTML = "<input name=\"percentage"+index+"\" id=\"percentage"+index+"\" value=\"\">";
}

function delRow(){
if(document.getElementById("tbl_gd").rows.length>2){
document.getElementById("tbl_gd").deleteRow(-1);
}
}
function getInfo(){
var infoStr="";
alert(name2.value);
alert(tbl_gd.rows.length);
for(var i=1;i<=tbl_gd.rows.length-1;i++){

infoStr+=document.all.item("name"+i).value+"::";
infoStr+=document.all.item("cardNo"+i).value+"::";
infoStr+=document.all.item("moneyInvested"+i).value+"::";
infoStr+=document.all.item("percentage"+i).value+";;";
}

alert(infoStr);
}
</script>
</html>

JavaScript实现表中行的增加和删除

推荐度：

点击下载本文 文档为doc格式

标签：删除表格添加

热门焦点

JavaScript实现表中行的增加和删除

JavaScript实现表中行的增加和删除

JavaScript实现表中行的增加和删除

最新推荐

猜你喜欢

热门推荐