html5中可以有多个form吗

154 阅读 0 评论 102 点赞

我是靠谱客的博主犹豫大叔，这篇文章主要介绍html5中可以有多个form吗，现在分享给大家，希望可以做个参考。

本教程操作环境：windows7系统、HTML5版、Dell G3电脑。

表单最重要的表现是在客户端接收用户的信息，然后将数据递交给后台的程序来操控这些数据，从技术的概念上说，表单就是用来操作form对象，对象是一种基本的数据类型。

HTML表单是一个包含表单元素的区域，用于搜集不同类型的用户输入；表单元素是允许用户在表单中（比如：文本域、下拉列表、单选框、复选框等等）输入信息的元素；表单使用表单标签（<form>）定义。

表单最终是需要提交数据给服务器的，form标签有一个action属性，这个属性用来指定服务器地址；

action属性用来注定属性提交给哪个服务器。
action属性和的超链接中的href属性一样。都可以向服务器发送请求（request）

复制代码<from action="url"><!--url指提交的目标网站 -->
<!-- 画一个提交按钮
	这个按钮可以使用input输入阈，type="submit"的时候表示这个按钮是一个提交按钮，具有提交表单的能力 -->
<!-- 对于按钮来说，按钮的value属性用来指定按钮上显示的文本信息。 -->
	<input type="sumbit" vaule="登录"/>
	<!-- buutton这是一个普通按钮，不具备提交表单的能力 -->
		<input type="button" />
</from>1
2
3
4
5
6
7
8
<from action="url"><!--url指提交的目标网站 -->
<!-- 画一个提交按钮
	这个按钮可以使用input输入阈，type="submit"的时候表示这个按钮是一个提交按钮，具有提交表单的能力 -->
<!-- 对于按钮来说，按钮的value属性用来指定按钮上显示的文本信息。 -->
	<input type="sumbit" vaule="登录"/>
	<!-- buutton这是一个普通按钮，不具备提交表单的能力 -->
		<input type="button" />
</from>
登录后复制

一个网页当中可以有多个表单form

在同一个HTML的页面中规则上允许可以用到多个<form></form>标签，但是为了防止提交时后台无法识别最好给表单加上不同的ID或者class，这里选择的是加上不同id的方法供大家参考。

表单和超链接没什么太大的区别

超链接和表单都可以向服务器发送请求
超链接没法进行数据收集
表单发送请求的同时还可以携带数据

表单是以什么格式提交给服务器的？

http://localhots:8080/jd/login?username=abc&userpwd=111

格式：

actionname=vaule&namevaule&name=vaule&name=vaule&name=vaule…

HTTP协议规定，必须以这种格式提交给服务器。

复制代码<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	<form>
	<table >
		<tr>
			<td>用户名</td>
			<td><input type="text" name="username"/></td>
		</tr>
		<tr>
			<td>密码</td>
			<td><input type="password" name="userpwd"/></td>
		</tr>
		<tr align="center">
			<td colspan="2" >
			<input type="submit" value="登录">
			    
			<input type="reset" value="清空"></td>
		</tr>
	</table>
		</form>
	</body>
</html>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
	<form>
	<table >
		<tr>
			<td>用户名</td>
			<td><input type="text" name="username"/></td>
		</tr>
		<tr>
			<td>密码</td>
			<td><input type="password" name="userpwd"/></td>
		</tr>
		<tr align="center">
			<td colspan="2" >
			<input type="submit" value="登录">
			&nbsp;&nbsp;&nbsp;&nbsp;
			<input type="reset" value="清空"></td>
		</tr>
	</table>
		</form>
	</body>
</html>
登录后复制

multiple="multiple" 支持多选

在后方添加size，可以设置多选上限

复制代码<select multiple="multiple" size="n">1
<select multiple="multiple" size="n">
登录后复制

file控件（上传文件）

复制代码<input type="file" />1
<input type="file" />
登录后复制

readonly disabled

复制代码		<!-- readonly与disabled相同点：都是只读不能修改
		但是readonly可以提交给服务器，disabled数据不会被提交（即使有name属性也不会被提交）-->
		<form action="http://localhost:8080/taobao/save">
			用户代码<input type="text" name="usercode" value="110" readonly />
			<br>
			用户代码<input type="text" name="username" value="120" disabled />
			<br>
			<input type="submit" value="提交数据" />1
2
3
4
5
6
7
8
<!-- readonly与disabled相同点：都是只读不能修改
		但是readonly可以提交给服务器，disabled数据不会被提交（即使有name属性也不会被提交）-->
		<form action="http://localhost:8080/taobao/save">
			用户代码<input type="text" name="usercode" value="110" readonly />
			<br>
			用户代码<input type="text" name="username" value="120" disabled />
			<br>
			<input type="submit" value="提交数据" />
登录后复制

maxlength

设置文本框中可输入的字符数

复制代码<input type="text" maxlength="3">1
<input type="text" maxlength="3">
登录后复制

最后

以上就是犹豫大叔最近收集整理的关于html5中可以有多个form吗的全部内容，更多相关html5中可以有多个form吗内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。

本文分类：表单
浏览次数：154 次浏览
发布日期：2022-11-06 10:00:01
本文链接：https://www.kaopuke.com/article/k-p-k_14_ujo_14_f3_14__23__18_0.html

html5中可以有多个form吗

最后

评论列表共有 0 条评论

发表评论取消回复

html5中可以有多个form吗

最后

相关文章

评论列表共有 0 条评论

发表评论 取消回复

微信扫一扫：分享

发表评论取消回复