如果你对Html比较熟悉的话肯定知道有个的HTML标记。在与之间有诸如
类型(type)为Text、Password、Button、Submit、Reset等的标记(
元素)。我们这里所说的动态的
添加Form项就是指动态的添加中的Text元素。那么如何去实现动态的添加Form项呢？ 我们先分析分析实现动态添加form项的思路。 如果是让您自己或用诸如FrontPage、DreamWeaver静态编写Html文档来增加一个又一个类型为text的form元素的话。您肯定是写完第一个类型为text的form元素后，再会加入第二个类型为text的form元素，就这样一直加到满足数目条件为止。我们先不说在加一个新的类型为text的元素时，应该将已经存在且有内容、类型也为text的其他form元素也显示出来。上面所说的通过静态编写Html文档来增加类型为text的form元素的方法，其实就是我们在ASP程序文件中实现动态添加类型为text的form元素的基本思路。如何去得到已经存在且有内容、类型也为text的其他form元素的内容呢？在ASP程序中通过request.form("TextFieldName")可以得到。其中的"TextFieldName"是指中名字为"TextFieldName"的项。就是指中的"TextFieldName"。 现在我们知道如何得到了表单的内容了，那么我们就可以通过这种方法来得到已经存在且有内容、类型为text的form元素的值了。再在显示这些已经有值的text项时，我们就可以把所得到的值赋给相应的项。接下来，我们又会想如何去知道一共有多少个有内容、类型为text的form项呢？我们可以通过以下这种方法来得到。那就是通过request.form("TextFieldName")的Count属性来得到。这是因为在得到表单中多个类型为Text并且同名的form元素时，我们能得到的是一组值，也就说它们的值是放在一个名为TextFieldName的集合之中。而此时的count属性就是统计这个集合中同类元素的数目的，这样我们就可以知道一共有多少个这样的类型为text的form元素了，并且可以用循环语句与count属性取出集合各自的值。您可能会问：那么我们又如何才能得到这个集合中每一个名为TextFieldName类型为text的form的元素的值呢？在此之前我们先定义一个变量I，它的初始值为1，其实这个变量I就是我们在做循环时的变量。接下来我们就可以通过request.form("TextFieldName")(I)的方法来获取每一个名为TextFieldName的类型为text的form元素的值了。还有一点要注意，就是我们在将已经有值、类型也为text的form元素的值取出赋给相应项并显示出来的时候，我们还应该再增加一个新的类型为text的form项。为什么呢？这是为了让我们还可以再接着继续添加新的值。不然的话，在取出所有已经有值的类型为text的form元素后，您就没有继续添加新值的地方了，那也就成不了动态添加Html文档中Form项了。所以呢，您一定不能忘记这很重要的一点。现在我们知道如何取得这些满足条件的类型为text的form的元素数目了，也知道如何分别获取它们各自的值了。那么我又如何去控制只仅仅将已经有值、类型为text的form的元素呢？以及我们倒底如何去实现上面所说的一切呢？那么接下来我会给出它的源代码，并且会在有些地方加上注释或给出解释。'/*DynamicAddForm.asp文件的源代码开始点*/Dynamic Add Form Text Elements.
'/*DynamicAddForm.asp文件的源代码结束点*/ 您在看了这些源代码后，可能会注意到有两个类型都为text的form项元素：一个名字为items、一个名字为newItem。为什么呢？这是因为我们要区别哪些是用户通过点击按钮、并且输入了新值后得到的，哪些是我们为了让用户能够有地方可以输入新值的类型为text的form项元素。这样我们就能很清楚的在循环时只列出用户已经添加的、有值的类型为text的form项元素了。这就是我们为什么把它们命名成不同的名字的缘故，是不是很妙呢？呵呵 :-)。其实这种方法的关键在于利用了request.form("TextFieldName")的Count属性和request.form("TextFieldName")(I)的方法，才使得我们更容易的获取名为TextFieldName的类型为text的form项元素的数目和分别获取它们的值。这两种方法的用处很大，可以大大的简化我们所要编写的代码。大家一定要记住了这两种用法。下面我再给出一个没有用到这两种用法的ASP程序源代码，大家比较比较，体会一下为什么上面的代码要好。 '/*DynamicAddForm2.asp文件的源代码开始点*/Add new mail server site. All Rights Reserved.function mycheck(tt) {alert("afd")return false}追加新邮件服务器信息条数邮件服务器URL用户名参数变量密码参数变量站点名称[ * * * Example: * * * ]
0.990.net/prog/login?userpass990.net
<HTML>
<HEAD>
</HEAD>
<script>
function addForm(){
var form = document.createElement("form")
var str= "<input name="up" type='file'/>"//这里放你想在form里放的标签。
form.innerHTML = str
document.body.appendChild(form)
}
</script>
<BODY>
<input type="button" onclick="addForm()" value="点击添加"/>
</BODY>
</HTML>
微信扫一扫
支付宝扫一扫
评论列表（0条）