jquery与php交互之GET、 POST

最新推荐文章于 2021-03-28 07:38:27 发布

xgwdy06

最新推荐文章于 2021-03-28 07:38:27 发布

阅读量313

点赞数

转自：http://blog.csdn.net/zhou_yujia/article/details/51606824#

GET:两个参数

html

[html] view plain copy print ?

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("button").click(function()
{
$.get(//使用get方法向服务器端获取数据
'check.php',
function (data) {
$("button").after(data);
}
);
});
});
</script>
</head>
<body>
<button>load some data</button>
</body>
</html>

[php] view plain copy print ?

<?php
/**
* Created by PhpStorm.
* User: admin-pc
* Date: 2016/6/7
* Time: 8:20
*/
if(isset($_SERVER['HTTP_X_REQUESTED_WITH'])&&$_SERVER['HTTP_X_REQUESTED_WITH']=='XMLHttpRequest')
echo 'successful';
else echo 'wrong';

post：三个参数

[html] view plain copy print ?

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- <style type="text/css">
ul{border:1px solid black; list-style: none;margin:0pt;padding:0pt;float:left;
font-family: Verdana,Arial,sans-serif;font-size: 12px;width: 400px;
}
li{padding:10px 5px;border-bottom: 1px solid black;}
label{width: 100px;text-align: right;margin-right:10px;float:left; }
#response{display: none;}
</style>-->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("input:button").click(function()//这里不可以用button标签写
{
var data=$('form').serialize();
$.post(
'process.php',// $("form").serialize(),
data,
function(data,status)
{
$('#information').hide();
// alert("suce");
// $("button").after(data);
// $('#response').text($("form").serialize());
$('#response').html(data).show();//换成html的方式展示出，而text()函数只能直接输出，所以标签略过，换行符\n也不好使
// alert(status);
},
'html'
);
// console.log($("form").serialize());
// $("p").text(data);
});
});
</script>
</head>
<body>
<form action="">
<ul id="information">
<li>
<label>email:</label>
<input type="text" name="email">
</li>
<li>
<label>full name</label>
<input type="text" name="fullname">
</li>
<li>
<label>sex</label>
<input type="radio" name="sex" value="male" checked="checked">male
<input type="radio" name="sex" value="female">female
</li>
<li>
<label>country</label>
<select name="country">
<option value="india">india</option>
<option value="uk">uk</option>
<option value="usa">usa</option>
</select>
</li>
</ul>
</form>
<input type="button" value="go" name="submit">
<p id="response"></p>
</body>
</html>

php

[php] view plain copy print ?

<?php
/**
* Created by PhpStorm.
* User: admin-pc
* Date: 2016/6/7
* Time: 9:28
*/
header('Content-Type:text/html;charset=gb2312');
$responsestring="Dear ".$_POST['fullname'].",your contact information has been saved.";
$responsestring.="you entered the following information: ";
$responsestring.="<br/>";
$responsestring.="email:".$_POST['email'];
$responsestring.="<br/>";
$responsestring.=" sex:".$_POST['sex'];
$responsestring.="<br/>";
$responsestring.=" country".$_POST['country'];
echo $responsestring;

其实psot提交的也不一定是框框里你输入的对吧，也有可能是你点击的，比方说点击第一个显示下面的

[html] view plain copy print ?

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('p').click(function(node){
var data=$(this).text();//试了很多种方法，只有这种读取标签内容文本的方法可以读取从而选择我想要的
// alert(data);
var tmp;
if(data=="MissZhou要努力1") tmp=1;
else if(data=="MissZhou要努力2") tmp=2;
else tmp=3;
// alert(tmp);
$.post('process.php',{name:tmp},function(dd){
$('div').html(dd).show();
});
});
});
</script>
</head>
<body>
<p name="name">MissZhou要努力1</p><br>
<p name="name">MissZhou要努力2</p><br>
<p name="name">MissZhou要努力3</p><br>
<div></div>
</body>
</html>

[php] view plain copy print ?

<?php
/**
* Created by PhpStorm.
* User: admin-pc
* Date: 2016/6/10
* Time: 16:08
*/
header('Content-Type:text/html;charset=utf-8');
$tmp=$_POST['name'];
if($tmp==1)
echo "你不想找工作了吗?找不到工作喝西北风啊啊？！";
if($tmp==2)
echo "就剩三个月了玩什么玩再玩就真玩完了";
if($tmp==3)
echo "滚！去！学！习！";
//echo $tmp;

xgwdy06

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery与php交互之GET、 POST

转自：http://blog.csdn.net/zhou_yujia/article/details/51606824#GET:两个参数html[html] view plain copy print?> html lang="en"> head> meta charset="UTF-8"> title>Titletitle>
复制链接

扫一扫