您的位置:首页 > Web前端 > JQuery

PHP使用jQuery的ajax的功能

2015-04-24 18:40 183 查看
首先是html页面,引入了Jquery

</pre><pre name="code" class="html"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
</head>
<body>
<form action="" id="test" method="post">
用戶名
<input id="username" name="username" type="text"/>
<br>
密码
<input id="pwd" name="pwd" type="text"/>
<br>
<input id="subminButton" name="pwd" type="button" value="提交"/>
</form>
<p>姓名:<span id="name1"></span></p>
<p>密码:<span id="pwd1"></span></p>

<script type="text/javascript" >
$("#subminButton").click(function (){

var username=$("#username").val();
var password=$("#pwd").val();

var data="username="+username+"&pwd="+password;

var url="test.php";

$.post(url,data,function(json){
ajaxobj=eval("("+json+")");
$("#name1").html(ajaxobj.name);
$("#pwd1").html(ajaxobj.password);

//alert(ajaxobj.name);
});
});

</script>
</body>
</html>


接着是PHP页面,命名为test.php,将接收到的数据又以Json的形式返回
<?php
$name= $_POST['username'];
$password=$_POST['pwd'];
$list=array("name"=>$name,"password"=>$password);
echo json_encode($list);

?>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: