js动态增加input

Posted on Posted in js
Tips: 本文创建于2014年3月26日,已超过 2 年,内容或图片可能已经失效!

主程序

[code lang="php"]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
function likai(mytype){
var o = $("add");
var obj_name = document.getElementsByTagName("input");
var zhi_str = "str"+(obj_name.length-1);
var zhi = $(zhi_str);
if(zhi.value){
var newInput = document.createElement("input");
newInput.type = mytype;
newInput.name = "input"+obj_name.length;
newInput.id = "str"+obj_name.length;
newInput.setAttribute("onblur","likai('text')");
var newline = document.createElement("br");
o.appendChild(newInput);
o.appendChild(newline);
}

}
function $(id){
return document.getElementById(id);
}
</script>
</head>
<body>
<form name="form" action="tools.php" method="post">
输入字符串:<br />
<div id="add">
<input type="text" id="str1" name="input1" onblur="likai('text')"/><br />
</div>
<input type="submit" value="提交"/>
</form>
</body>
</html>
[/code]
************************************************************************************
处理程序
[code lang="php"]
<?php
header("Content-Type:text/html; charset=utf-8");
$str ="";
foreach ($_POST as $k => $v){
$str .= $v;
}
echo $str;
/* var_dump($_POST);
echo count($_POST);

$str1 = $_POST['str1'];
$str2 = $_POST['str2'];

echo connstr($str1,$str2);
function connstr(){
$getArr = func_get_args();
$str = "";
foreach($getArr as $k => $v){
$str .= $v;
}
return $str;
}
*/
[/code]
************************************************************************************
参考代码
[code lang="html"]
<html>
<head>
<title>动态添加表单元素</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<script>
function AddElement(mytype){
var mytype,TemO=document.getElementById("add");
var newInput = document.createElement("input");
newInput.type=mytype;
newInput.name="input1";
TemO.appendChild(newInput);
var newline= document.createElement("br");
TemO.appendChild(newline);
}
</script>
<body>
<form action="" method="get" name="frm">
<div id="add">
<input type="text" name="textfield">

</div>
</form>
<input name="" type="button" value="新建文本框" onClick="AddElement('text')" />
<input name="" type="button" value="新建复选框" onClick="AddElement('checkbox')" />
<input name="" type="button" value="新建单选框" onClick="AddElement('radio')" />
<input name="" type="button" value="新建文件域" onClick="AddElement('file')" />
<input name="" type="button" value="新建密码框" onClick="AddElement('password')" />
<input name="" type="button" value="新建提交按钮" onClick="AddElement('submit')" />
<input name="" type="button" value="新建恢复按钮" onClick="AddElement('reset')" />
</body>
</html>
[/code]

» 转载请注明来源:若我若鱼 » js动态增加input

Leave a Reply

Your email address will not be published. Required fields are marked *

four × 5 =