袁来如此的工作笔记
袁来如此的工作笔记
竹杖芒鞋轻胜马,谁怕? 一蓑烟雨任平生。

php+jquery+ajax+json简单小例子

浏览量:761

Php代码

<html>

<title>php+jquery+ajax+json简单小例子</title>

<?php

header("Content-Type:text/html;charset=utf-8");

?>

<head>

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>

<script type="text/javascript">

$(function() {

$("#subbtn").click(function() {

var params = $("input").serialize();

var url = "1.php";

$.ajax({

type: "post",

url: url,

dataType: "json",

data: params,

success: function(msg){

var backdata = "您提交的姓名为:" + msg.name +

"<br /> 您提交的密码为:" + msg.password;

$("#backdata").html(backdata);

$("#backdata").css({color: "green"});

}

});

});


});


</script>

</head>

<body>

<p><label for="name">姓名:</label>

<input id="name" name="name" type="text" />

</p>


<p><label for="password">密码:</label>

<input id="password" name="password" type="password" />

</p>


<span id="backdata"></span>

<p><input id="subbtn" type="button" value="提交数据" /></p>

</body>

</html>


 1.php代码:

<?php

echo json_encode($_POST);

?>


ajax通过 HTTP 请求加载远程数据。

jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性。

最简单的情况下,$.ajax()可以不带任何参数直接使用。

注意,所有的选项都可以通过$.ajaxSetup()函数来全局设置。

回调函数

如果要处理$.ajax()得到的数据,则需要使用回调函数。beforeSend、error、dataFilter、success、complete。

  • beforeSend 在发送请求之前调用,并且传入一个XMLHttpRequest作为参数。

  • error 在请求出错时调用。传入XMLHttpRequest对象,描述错误类型的字符串以及一个异常对象(如果有的话)

  • dataFilter 在请求成功之后调用。传入返回的数据以及"dataType"参数的值。并且必须返回新的数据(可能是处理过的)传递给success回调函数。

  • success 当请求之后调用。传入返回后的数据,以及包含成功代码的字符串。

  • complete 当请求完成之后调用这个函数,无论成功或失败。传入XMLHttpRequest对象,以及一个包含成功或错误代码的字符串。


打赏