论坛首页 Web前端技术论坛

Html form 提交

浏览 16973 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2009-01-07   最后修改:2009-01-07

Html From 提交

关于Html form表单的提交,很容易。。。但如果不仔细还是能有很多错误。

 

提交的button name 属性为 submit form的submit方法失效 。代码如下

<html>
	<head></head>
	<script type="text/javascript">
	function getData(){
		document.forms[0].submit();	
	}
	</script>
	<body>
		
		<form id="form1" name="form1" method="get" action="http://xiayuanfeng.iteye.com">
			<input type="button" name="submit" onclick="getData();" value="提交">
		</form>
	
	</body>	
</html>

 如果改为

<html>
	<head></head>
	<script type="text/javascript" src="jquery.js"></script>
	<script type="text/javascript">
	function getData(){
		document.forms[0].submit();	
	}
	</script>
	<body>
		
		<form id="form1" name="form1" method="get" action="http://xiayuanfeng.iteye.com">
			<input type="button" name="aa" onclick="getData();" value="提交">
		</form>
	
	</body>	
</html>

 成功提交。。

 我们来看看原因

<html>
	<head></head>
	<script type="text/javascript" src="jquery.js"></script>
	<script type="text/javascript">
	function getData(){
		var objform = document.forms[0]
		for(var i in objform){
			if(i.indexOf("submit")!=-1){
				alert(i+" ="+objform[i]);
			}	
		}
	}
	</script>
	<body>
		
		<form id="form1" name="form1" method="get" action="http://xiayuanfeng.iteye.com">
			<input type="text" name="aa">
			<input type="button" name="submit" onclick="getData();" value="提交">
		</form>
	
	</body>	
</html>

  发现 submit已经变成 form 的一个属性了,并不是方法。这下明白了吧。把submit(也就是submit方法)覆盖了。所以要注意提交表单name的命名方式不要和form原有的方法,属性相同,这样会导致原来的form属性方法失效。

 

   发表时间:2009-05-08  
晕,我找了半天了,原来是这错误啊~
0 请登录后投票
   发表时间:2009-12-10  
原来是被覆盖为属性了。。。难怪。 问题是解决了,但是不知道为什么是什么原因。
看了你的回答,很满意。
感谢!
0 请登录后投票
   发表时间:2009-12-10  
觉得还可以覆盖函数。

function test(){}

<input type="button" name="test" onclick="test()" value="提交"> 

0 请登录后投票
   发表时间:2009-12-11  
这也是IE下才存在的问题吧。
0 请登录后投票
   发表时间:2009-12-11  
ie下会将form里的字段作为form对象的属性。。。
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics