表单的action属性和提交按钮

最新推荐文章于 2024-02-22 19:00:47 发布

qq1712088151

最新推荐文章于 2024-02-22 19:00:47 发布

阅读量4k

点赞数 1

分类专栏： Java 文章标签： action input button html browser border

本文链接：https://blog.csdn.net/qq1712088151/article/details/7407335

版权

Java 专栏收录该内容

212 篇文章 0 订阅

订阅专栏

当用户点击提交按钮的时候，表单的内容会被提交到其他文件。表单的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