1. 程式人生 > >form表單提交三種方式,demo例項詳解

form表單提交三種方式,demo例項詳解

第一種:使用type=submit  可以直接提交
<html>
 <head>
  <title>submit直接提交</title>
 </head>

 <body>
	<!-- 表單的提交方式一 -->
	<form method="get">
		username: <input type="text" name="username"/>
		<br/>
		password: <input type="password" name="password"/>
		<br/>
		<input type="submit" value="提交"/>
	</form>

 </body>
<script type="text/javascript">

</script>
</html>
第二種:使用type=button提交   需要得到表單的控制元件 使用表單空間呼叫自己的submit()方法
<pre name="code" class="html"><html>
 <head>
  <title>button提交</title>
 </head>

 <body>
	<!-- 表單的提交方式二 -->
	<form id="form01" method="get">
		username: <input type="text" name="username"/>
		<br/>
		password: <input type="password" name="password"/>
		<br/>
		<input type="button" value="提交" onclick="form01();"/>
	</form>
 </body>
<script type="text/javascript">
	//使用button進行表單的提交
	function form01() {
		//得到form標籤
		var form01 = document.getElementById("form01");
		//提交form表單
		form01.submit();
	}
</script>
</html>
第三種:直接使用get網址 進行超連結提交
<pre name="code" class="html"><a href="html?username=ccc&password=123456">超連結提交資料</a>