使用js实现input输入框的增加
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta
http-equiv="Content-Type" content="text/html; charset=utf-8"
/>
<title>JS点击添加input输入框</title>
<script
type="text/javascript">
/****添加新条目***/
/******点击添加input输入框JS******/
function
checkRowsLimit()
{
var rowLimit = 10;
var
len=document.getElementById(‘filearea‘).rows.length;
if(len==rowLimit)
{
alert(‘抱歉，为了您主页美观，只能添加这么多条目了。‘);
return
false;
}
else
{
return true;
}
}
function addNewRow()
{
var
obj=document.getElementById(‘filearea‘);
var row=obj.insertRow(-1);
var
c0=row.insertCell(0);
c0.innerHTML=‘<input type=text size="3"
maxlength=8 name="question" value=""
onpropertychange=changeFlagValue()> ：‘;
c0.align=‘right‘;
var c1=row.insertCell(1);
c1.innerHTML=‘<input type=text
size=50 maxlength=50 name="answer" style="margin-left:1px;" value=""
onpropertychange=changeFlagValue()>‘;
c1.align=‘left‘;
var c2=row.insertCell(2);
c2.innerHTML=‘<a
href="javascript:void(0)"
onclick="removeRow(this)">[删除]</a>‘;
changeFlag =
true;
try
{
comm_set_page_height();
}
catch
(e)
{
}
}
function
removeRow(fontobj)
{
if(confirm("确定取消该项吗?"))
{
var
obj=document.getElementById(‘filearea‘);
var
n=fontobj.parentNode.parentNode.rowIndex;
obj.deleteRow(n);
}
}</script>
</head>
<body>
<table
width="735" border="0" id="filearea">
<tr>
<td align=right>商品编号<input type="text"
onpropertychange=changeFlagValue() maxLength=8 size=3 name=question
/> ：</td>
<td align=left><input
type="text" style="MARGIN-LEFT:
1px"
onpropertychange=changeFlagValue() maxLength=50 size=50
name=answer /></td>
<td><a href="#"
onClick="if(checkRowsLimit()) {addNewRow();changeFlag=true}"
title="点击后在上面添加的输入框">[添加条目]</a></td>
</tr>
</table>
</body>
</html>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
