WampServer+PHP+form表单验证

后端form表单测试

GET方式

1.安装 WampServer

2.打开www目录,新建文件夹并拖入HbuilderX,新建测试的HTML和PHP文件

image-20210719130455200

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form action="get.php" method="get">
			姓名:<input type="text" name="name" /><br>
			密码:<input type="password"  name="pass"  /><br />
			<input type="submit" value="提交"/>
		</form>
	</body>
</html>

<?php
 var_dump($_GET);
?>

游览器中输入localhost,并找到项目文件夹

image-20210719130538019

打开HTML

image-20210719130634154

输入信息,提交

image-20210719130704047

通过GET方式提交就会在地址栏显示输入的信息

image-20210719130745033

POST方式

更改代码

image-20210719130945740

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form action="post.php" method="post">
			姓名:<input type="text" name="name" /><br>
			密码:<input type="password"  name="pass"  /><br />
			<input type="submit" value="提交"/>
		</form>
	</body>
</html>

<?php
 var_dump($_POST);
?>

测试:

image-20210719131048998

image-20210719131100739

其他表单测试

radio单选
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form action="post.php" method="post">
			姓名:<input type="text" name="name" /><br>
			密码:<input type="password"  name="pass"  /><br />
			<input type="submit" value="提交"/>
			性别:<input type="radio" name="gender" /><input type="radio" name="gender" /><input type="radio" name="gender" />保密
		</form>
	</body>
</html>

image-20210719131314222

image-20210719131352466

现在发现想要的数据并不是我们选择的值,这是因为没有给其赋value的值

性别:<input type="radio" name="gender" value="0" /><input type="radio" name="gender"  value="1"/><input type="radio" name="gender"  value="2"/>保密

修改代码后测试

image-20210719131533307

image-20210719131615815

checkbox多选

添加代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form action="post.php" method="post">
			姓名:<input type="text" name="name" /><br>
			密码:<input type="password"  name="pass"  /><br />
		
			性别:<input type="radio" name="gender" value="0" /><input type="radio" name="gender"  value="1"/><input type="radio" name="gender"  value="2"/>保密<br>
			爱好:<input type="checkbox" name="love" value="0" />篮球
			<input type="checkbox" name="love" value="1" />排球
			<input type="checkbox" name="love" value="2" />足球
			<input type="checkbox" name="love" value="3" />羽毛球<br>
				<input type="submit" value="提交"/>
		</form>
	</body>
</html>


测试:

image-20210719132021512

image-20210719132032463

测试结果为只能获取到一个值,需要修改name属性为数组类型

	爱好:<input type="checkbox" name="love[]" value="0" />篮球
			<input type="checkbox" name="love[]" value="1" />排球
			<input type="checkbox" name="love[]" value="2" />足球
			<input type="checkbox" name="love[]" value="3" />羽毛球<br>

image-20210719132155097

image-20210719132204772

备注

如果需要将信息存入MySQL数据库,或者从数据库中读取数据进行登录验证,参照 点我一下

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值