表单的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

用图片来做提交按钮(表单通用)

用图片来做提交按钮(表单通用) 转载▼ 有时候为了达到比较好的视觉效果,有人会使用图片代替按钮来提交或者重置表单数据。 一: 二: 代...
  • jaray
  • jaray
  • 2014年10月28日 16:47
  • 1299

一个表单多个按钮提交

在做到表单的提交的时候,如果是一个按钮提交的话,对应一个action。只需要将form表单属性method=”post” action=”aasubmit”(aasubmit是一个action名) ...
  • XLM11
  • XLM11
  • 2015年12月27日 19:13
  • 5415

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

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

android button属性

android:autoLink setAutoLinkMask(int)控制链接网址和电子邮件地址等是否自动发现并转换为可点击的链接。 android:autoText setKeyListe...
  • yuexuning58
  • yuexuning58
  • 2013年12月27日 13:29
  • 35451

表单的自定义按钮提交

大家都知道了表单的自带submit按钮提交但是是否知道自定义按钮提交呢?还有超链接提交方式呢?? 下面我就为大家直接开撸: 1、表单提交方式 * 使用submit提交 ..... ...
  • a_lonely_dancer
  • a_lonely_dancer
  • 2016年09月05日 01:51
  • 3088

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

触发form表单的两种提交方式,submit和button的用法1.当输入用户名和密码为空的时候,需要判断。这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写;有两种方法,一种是用submi...
  • FANGAOHUA200
  • FANGAOHUA200
  • 2016年12月05日 23:49
  • 2644

FloatingActionButton属性、用法,以及解析并解决sdk25以上只隐藏不显示的问题

悬浮按钮(FloatingActionButton),在下文简称fab,今天我们来讲讲它的一些属性与用法,以及解析并解决sdk25以上FloatingActionButton只隐藏不显示的问题。先展示...
  • chen_xi_hao
  • chen_xi_hao
  • 2017年07月04日 17:38
  • 2441

Intent action属性大全

ntent的中文意思是“意图,目的”的意思,可以理解为不同组件之间通信的“媒介”或者“信使”。    目标组件一般要通过Intent来声明自己的条件,一般通过组件中的元素来过滤。    Intent在...
  • TiaoZhanJi_Xian
  • TiaoZhanJi_Xian
  • 2015年12月21日 15:39
  • 855

表单提交后,提交按钮不可用,防止用户多次提交

防止表单提交按钮多次提交的办法  如果表单是通过onsubmit进行Ajax提交,注意将表单提交按钮input type属性设为button,尽量不要设置为submit类型。 另外,在提交事件发出后...
  • Zoe_Wang_ing
  • Zoe_Wang_ing
  • 2013年08月01日 14:42
  • 1602

表单中有多个提交按钮,想实现点击不同的按钮,实现不同的操作

在开头定义javascript然后在正文中的按钮上用onClick="return calc_form()"来转向 function print_form()   {    document.form...
  • dtwangquan
  • dtwangquan
  • 2014年01月24日 08:42
  • 2309
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:表单的action属性和提交按钮
举报原因:
原因补充:

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