php web基础教程之表单传递

最新推荐文章于 2024-09-19 13:29:13 发布

赤兔马百花袍

最新推荐文章于 2024-09-19 13:29:13 发布

阅读量232

点赞数

分类专栏： php

本文链接：https://blog.csdn.net/xiao_qing_ge/article/details/103634505

版权

php 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

表单之get提交

前端基于Bootstrap（这样既美观又方便）。
html代码

<form action="controller/index.php" method="GET" ><!-- get的传值方式 -->
	<div class="form-group">
	<label for="exampleInputEmail1">Email address</label>
	<input type="email" class="form-control" id="exampleInputEmail1" name="exampleInputEmail1" placeholder="Email"><!-- 表单是认准name的值的 -->
	</div>
	<div class="form-group">
	<label for="exampleInputPassword1">Password</label>
	<input type="password" class="form-control" id="exampleInputPassword1" name="exampleInputPassword1" placeholder="Password">
	</div>
	<button type="submit" class="btn btn-default">Submit</button>
</form>

php代码

print_r($_GET);
echo '<br>';
print_r($_POST);
echo '<br>';
print_r($_REQUEST);

结果：
在这里插入图片描述

在这里插入图片描述

表单的get提交结束。

表单之post提交

html代码

<form action="controller/index.php" method="POST" ><!-- POST的传值方式 -->
	<div class="form-group">
	<label for="exampleInputEmail1">Email address</label>
	<input type="email" class="form-control" id="exampleInputEmail1" name="exampleInputEmail1" placeholder="Email"><!-- 表单是认准name的值的 -->
	</div>
	<div class="form-group">
	<label for="exampleInputPassword1">Password</label>
	<input type="password" class="form-control" id="exampleInputPassword1" name="exampleInputPassword1" placeholder="Password">
	</div>
	<button type="submit" class="btn btn-default">Submit</button>
</form>

php代码

print_r($_GET);
echo '<br>';
print_r($_POST);
echo '<br>';
print_r($_REQUEST);

结果：
在这里插入图片描述

在这里插入图片描述

表单之ajax提交

这里的ajax通过jq框架来写（既简单又方便记忆）。
get方式：
前端代码：

<body>
	<form><!-- POST的传值方式 -->
		<div class="form-group">
		<label for="exampleInputEmail1">Email address</label>
		<input type="email" class="form-control" id="exampleInputEmail1" name="exampleInputEmail1" placeholder="Email"><!-- 表单是认准name的值的 -->
		</div>
		<div class="form-group">
		<label for="exampleInputPassword1">Password</label>
		<input type="password" class="form-control" id="exampleInputPassword1" name="exampleInputPassword1" placeholder="Password">
		</div>
	</form>
	<button type="submit" class="btn btn-default" onclick="submit()">Submit</button><!-- 按钮不能在<form>里面 -->
	<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
	<script src="jquery-3.3.1/jquery-3.3.1.min.js"></script>
	<script>
		function submit(){
			var email = $("#exampleInputEmail1").val();//获取id=exampleInputEmail1的值
			var passwd = $("#exampleInputPassword1").val();//获取id=exampleInputPassword1的值
			var datas = {
				userEmail:email,
				userPasswd:passwd
			};//把获取的值放到一个数组中
			$.ajax({
				url:'controller/index.php',//目标文件
				dataType:'json',//数据类型
				type:'get',//传输方式
				data:datas,//数据
				success:function(result){//返回值
					return '123';
				}
			});
		}
	</script>
	<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
	<script src="bootstrap-3.3.7/dist/js/bootstrap.min.js"></script>
</body>

php代码：

print_r($_GET);
echo '<br>';
print_r($_POST);
echo '<br>';
print_r($_REQUEST);

结果：
在这里插入图片描述

在这里插入图片描述
post方式：
前端代码：

<body>
	<form><!-- POST的传值方式 -->
		<div class="form-group">
		<label for="exampleInputEmail1">Email address</label>
		<input type="email" class="form-control" id="exampleInputEmail1" name="exampleInputEmail1" placeholder="Email"><!-- 表单是认准name的值的 -->
		</div>
		<div class="form-group">
		<label for="exampleInputPassword1">Password</label>
		<input type="password" class="form-control" id="exampleInputPassword1" name="exampleInputPassword1" placeholder="Password">
		</div>
	</form>
	<button type="submit" class="btn btn-default" onclick="submit()">Submit</button><!-- 按钮不能在<form>里面 -->
	<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
	<script src="jquery-3.3.1/jquery-3.3.1.min.js"></script>
	<script>
		function submit(){
			var email = $("#exampleInputEmail1").val();//获取id=exampleInputEmail1的值
			var passwd = $("#exampleInputPassword1").val();//获取id=exampleInputPassword1的值
			var datas = {
				userEmail:email,
				userPasswd:passwd
			};//把获取的值放到一个数组中
			$.ajax({
				url:'controller/index.php',//目标文件
				dataType:'json',//数据类型
				type:'post',//传输方式
				data:datas,//数据
				success:function(result){//返回值
					return '123';
				}
			});
		}
	</script>
	<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
	<script src="bootstrap-3.3.7/dist/js/bootstrap.min.js"></script>
</body>

php代码：

print_r($_GET);
echo '<br>';
print_r($_POST);
echo '<br>';
print_r($_REQUEST);

结果：
在这里插入图片描述

在这里插入图片描述
php传值的部分就讲完了，我们下一期再见。