表单的action属性和提交按钮

原创 2012年03月29日 15:19:58

当用户点击提交按钮的时候,表单的内容会被提交到其他文件。表单的action属性定义了所要提交到的目的文件,该目的文件收到信息后通常进行相关的处理。

<form name="input" action="html_form_action.asp" method="get">
	Username:
	<input type="text" name="user">
	<input type="submit" value="Submit">
</form> 

如果在上面这个文本框中输入一些字符,按下提交按钮以后,输入的字符将被提交到页面“action.asp”。

例如:
复选框

<html>
	<body>
		<form>
			I have a bike:
			<input type="checkbox" name="Bike">
			<br>
			I have a car:
			<input type="checkbox" name="Car">
		</form>
	</body>
</html>

这个例子说明了在HTML页面中如何创建复选框。用户可以选中,也可以取消选择复选框。
单选按钮

<html>
	<body>
		<form>
			Male:
			<input type="radio" checked name="Sex" value="male">
			<br>
			Female:
			<input type="radio" name="Sex" value="female">
		</form>
		<p>
			When a user clicks on a radio-button, the button becomes checked, and
			all other buttons with the same name become unchecked
		</p>
	</body>
</html>

这个例子说明了在HTML页面中如何创建单选按钮。
简单的下拉列表

<html>
	<body>
		<form>
			<select name="cars">
				<option value="volvo">
					Volvo
				<option value="saab">
					Saab
				<option value="fiat">
					Fiat
				<option value="audi">
					Audi
			</select>
		</form>
	</body>
</html>

这个例子说明了在HTML页面如何创建下拉列表。下拉列表是可以选择的列表。
预选的下拉列表

<html>
	<body>
		<form>
			<select name="cars">
				<option value="volvo">
					Volvo
				<option value="saab">
					Saab
				<option value="fiat" selected>
					Fiat
				<option value="audi">
					Audi
			</select>
		</form>
	</body>
</html>

这个例子说明了如何创建一个含有预先选定元素的下拉列表。
文本域

html>
	<body>
		<p>
			This example demonstrates a text-area.
		</p>
		<textarea rows="10" cols="30">
The cat was playing in the garden.
</textarea>
	</body>
</html>

这个例子说明了如何创建文本域(多行文本),用户可以在其中输入文本。在文本域中,字符个数不受限制。

创建按钮

<html>
	<body>
		<form>
			<input type="button" value="Hello world!">
		</form>
	</body>
</html>

这个例子说明了如何创建按钮。按钮上的文字可以自己定义。
数据周围的标题边框

<html>
	<body>
		<fieldset>
			<legend>
				Health information:
			</legend>
			<form>
				Height
				<input type="text" size="3">
				Weight
				<input type="text" size="3">
			</form>
		</fieldset>
		<p>
			If there is no border around the input form, your browser is too old.
		</p>
	</body>
</html>

这个例子说明了如何在数据周围画带有标题的边框。
含有文本框和提交按钮的表单:

<html>
	<body>
		<form name="input" action="action.asp" method="get">
			Enter your first name:
			<input type="text" name="FirstName" value="Mickey">
			<br>
			Enter your last name:
			<input type="text" name="LastName" value="Mouse">
			<br>
			<input type="submit" value="Submit">
		</form>
		<p>
			If you click the "Submit" button, you will send your input to a new
			page called action.asp.
		</p>
	</body>
</html>

这个例子说明了在HTML页面中加入表单。这个表单包含了两个文本框和一个提交按钮。
含有复选框的表单

<html>
	<body>
		<form name="input" action="action.asp" method="get">
			I have a bike:
			<input type="checkbox" name="Bike" checked>
			<br>
			I have a car:
			<input type="checkbox" name="Car">
			<br>
			<input type="submit" value="Submit">
		</form>
		<p>
			If you click the "Submit" button, you send your input to a new page
			called action.asp.
		</p>
	</body>
</html>

这个表单包含了两个复选框和一个提交按钮。
含有单选按钮的表单

<html>
	<body>
		<form name="input" action="action.asp" method="get">
			Male:
			<input type="radio" name="Sex" value="Male" checked>
			<br>
			Female:
			<input type="radio" name="Sex" value="Female">
			<br>
			<input type="submit" value="Submit Now!">
		</form>
		<p>
			If you click the "Submit" button, you will send your input to a new
			page called action.asp.
		</p>
	</body>
</html>

这个表单包含了两个单选按钮和一个提交按钮。
从表单发送电子邮件

<html>
	<body>
		<form action="MAILTO:someone@w3schools.com" method="post"
			enctype="text/plain">
			<h3>
				This form sends an e-mail to W3Schools.
			</h3>
			Name:
			<br>
			<input type="text" name="name" value="yourname" size="20">
			<br>
			Mail:
			<br>
			<input type="text" name="mail" value="yourmail" size="20">
			<br>
			Comment:
			<br>
			<input type="text" name="comment" value="yourcomment" size="40">
			<br>
			<br>
			<input type="submit" value="Send">
			<input type="reset" value="Reset">
		</form>
	</body>
</html>

这个例子说明了如何从一个表单发送电子邮件。

原文:http://www.rjpx.net/java-peixun/853.html

相关文章推荐

html页面FORM的action属性等于空值的用途

html页面FORM的action属性等于空值时,提交后处理页面响应的还是这个页面本身. 可以测试一下这个页面: 测试form中当action=""时的效果 ...
  • cbbbc
  • cbbbc
  • 2015年10月13日 11:04
  • 2143

Form表单的动作属性(Action)和确认按钮

表单的动作属性(Action)和确认按钮 当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。...

jQueue 动态设置form表单的action属性的值和方法

head> Web Service File Up&down Test FinePath: File : look file path $(function(){...

动态设置form表单的action属性的值的方法

原文出处:http://www.cnblogs.com/greywardens/archive/2013/01/26/2878232.html 用jQuery时,可如下设置:       ...

用JS动态改变表单form里的action值属性的方法

红色部分的代码写在js加载jsp的方法中,当jsp页面加载出来时,动态的替换了form中的Action方法。 function billTypeLink(a){ url=a.attr("u...

form表单的两种提交方式,submit和button的用法

1.当输入用户名和密码为空的时候,需要判断。这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写;有两种方法,一种是用submit提交。一种是用button提交。 方法一: 在jsp的...

form表单的两种提交方式,submit和button的用法

1.当输入用户名和密码为空的时候,需要判断。这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写;有两种方法,一种是用submit提交。一种是用button提交。 方法一: 在jsp的...

SpringMvc中返回Json数据的原理分析

为什么直接添加一个注解就能够返回JSon数据了呢?这个不得不说一下HttpMessageConverter。 HttpMessageConverter 是 Spring3.0 新添加的一个接口,负责...

关于java web 中JavaBean组件的说明

一、Java Bean技术是java的可重用组件技术,可以实现代码的重复利用,容易编写,容易维护,容易使用,还有一个最重要的是在任何安装了java运行环境的平台上使用,而不需要重新编译。 直接进入主...

get请求表单的action属性后不能带参数

最近在编写网页程序时,有类似如下代码: [html] view plain copy   form action="index.php?controlle...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:表单的action属性和提交按钮
举报原因:
原因补充:

(最多只允许输入30个字)