如何动态增加文本框？

greatlsd 2004-11-26 10:01:20

由于输入内容多少的不确定性，希望可以让使用者自主增加文本框，怎么实现？
不知我的描述大家能不能看懂？举个例子，原来的提交页面2个文本框，如果再需要输入更多的内容，我希望点击按钮可以再增加一个文本框来输入，如果只需要1个文本框，那么同样的，点击按钮可以取消一个

...全文

448 20 打赏收藏转发到动态举报

写回复

用AI写文章

20 条回复

切换为时间正序

请发表友善的回复…

发表回复

php_love 2004-12-19

打赏
举报

greatlsd 2004-12-01

打赏
举报

算了，不等了，结帐

greatlsd 2004-11-27

打赏
举报

楼上为什么晕

liuyangxuan 2004-11-27

打赏
举报

晕倒。

iuhxq 2004-11-27

打赏
举报

<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>

<body>
<script language="javascript">
function AddField()
{
var count = parseInt(document.form1.FieldCount.value)+1;
document.form1.FieldCount.value=count.toString();
var str = eval(FieldList).innerHTML;
eval(FieldList).innerHTML += '<input name=Field' + count.toString() + '><select name=select><option>自动编号</option><option>数字</option><option selected>字符</option></select><br>';
}

function DeleteField()
{
var count = document.form1.FieldCount.value;
var str = eval(FieldList).innerHTML;
var temp='<input name=Field' + count + '><select name=select><option>自动编号</option><option>数字</option><option selected>字符</option></select><br>';
str = str.toLowerCase();
temp = temp.toLowerCase();
str = str.replace(temp,"");
eval(FieldList).innerHTML = str;
document.form1.FieldCount.value=(count-1).toString();
}

function ResetField()
{
eval(FieldList).innerHTML = '';
document.form1.FieldCount.value=0;
}

function fdemo()
{
alert(eval(FieldList).innerHTML);
}
</script>

<form name="form1" method="post" action="">
<input name="FieldCount" type="hidden" id="FieldCount" value="0">
<input type="button" value="添加字段" onClick="AddField();"><input type="button" name="Submit" value="重新设计" onClick="ResetField();">
<input type="button" name="Submit" value="test" onClick="fdemo();">
<br>
<span id="FieldList"></span>
</form>

</body>
</html>

greatlsd 2004-11-27

打赏
举报

问题已经解决，谢谢各位，不过我还是想等godfather1hp来说说dwmx怎么做再结贴

greatlsd 2004-11-27

打赏
举报

lucks(无边落木)，我是把内容都提交到一个字段，然后用分隔符做分割

lucks 2004-11-26

打赏
举报

是很历害,
可是提交到数据库的时候有什么好的方法创建后增的字段名呢?

awaysrain 2004-11-26

打赏
举报

function addline(content){
newline=document.all.test.insertRow();
newline.insertCell().innerHTML='<input type="text" name="tt[]"><input type="button" value="删除此行" onclick="del()">'

}
---->
function addline(content){
newline=document.all.test.insertRow();
newline.insertCell().innerHTML='<input type="text" name="tt[' + document.all.test.rows.length+ ']"><input type="button" value="删除此行" onclick="del()">'

}

greatlsd 2004-11-26

打赏
举报

有个问题，这样添加的文本框，其名字都是tt[]，怎么让它的名字也做变量改变？我很菜，麻烦uGain(uGain.org)再指点一下

hflsj 2004-11-26

打赏
举报

来顶一下，

greatlsd 2004-11-26

打赏
举报

希望godfather1hp(魔鬼的左手√森哥 1hp - - 恶搞23 外号乔丹)能具体说说DWMX怎么做，收到马上结贴，谢谢

greatlsd 2004-11-26

打赏
举报

uGain(uGain.org) ，太牛了，就是要这个，哈哈，谢谢

godfather1hp(魔鬼的左手√森哥 1hp - - 恶搞23 外号乔丹) ，用DWMX怎么做，有这个功能？很感兴趣

hushuang7094(小小小问题) ，作为同一条记录存入

cncca 2004-11-26

打赏
举报

uGain(uGain.org)
up!

hushuang7094 2004-11-26

打赏
举报

你说的那些文本筐的值是作为同一条记录存进数据库还是作为不同的记录存进去？

森少 2004-11-26

打赏
举报

用DWMX做.

uGain 2004-11-26

打赏
举报

<form>
<input type="button" onclick="addline()" value="增加一行">
<table border="1" id="test">
<tr>
<td colspan="2"><input type="text" name="tt[]"></td>
</tr>
</table>
<input type="submit">
</form>
<script>
function addline(content){
newline=document.all.test.insertRow();
newline.insertCell().innerHTML='<input type="text" name="tt[]"><input type="button" value="删除此行" onclick="del()">'

}
function del(){
document.all.test.deleteRow(window.event.srcElement.parentElement.parentElement.rowIndex);
}
</script>

sdts 2004-11-26

打赏
举报

我有一个方案就是用innerHTML 然后循环写<input type=text> 用按钮控制循环的计数
没有实验过不知道行不行的通

uGain 2004-11-26

打赏
举报

是很历害,可是提交到数据库的时候有什么好的方法创建后增的字段名呢?
-->
像这样的情况大多都是用于模仿行数不确定的报表，一般是用两个表来记录这个结果，一个表记录报表的表头，如日期，总量等，另一个表与第一个表关连，记录表内的具体内容。

uGain 2004-11-26

打赏
举报

有个问题，这样添加的文本框，其名字都是tt[]，怎么让它的名字也做变量改变？
-->
<form>
输入文本框名称<input type="text" name="fieldname"> <input type="button" onclick="addline()" value="增加">
<table border="1" id="test">
<tr>
<td colspan="2"><input type="text" name="tt"></td>
</tr>
</table>
<input type="submit">
</form>
<script>
function addline(content){
newline=document.all.test.insertRow();
newline.insertCell().innerHTML='<input type="text" name="'+document.all.fieldname.value+'"><input type="button" value="删除此行" onclick="del()">'

}
function del(){
document.all.test.deleteRow(window.event.srcElement.parentElement.rowIndex);
}
</script>