Home > php教程 > php手册 > body text

jQuery、Ajax、PHP、Json的一个综合例子

WBOY
Release: 2016-06-06 19:52:24
Original
1007 people have browsed it

jQuery 是一个优秀的 Javascript 框架,对 js 进行了优秀的包装,提供了许多方便的功能。jQuery 对 ajax 的包装也堪称优秀。 jQuery 可以以 json 文件传输协议来传输数据(类 xml,而且大有取代 xml 的趋势),而网站后台代码必须与之配合使用。PHP 是用 json_

jQuery 是一个优秀的 Javascript 框架,对 js 进行了优秀的包装,提供了许多方便的功能。jQuery 对 ajax 的包装也堪称优秀。

jQuery 可以以 json 文件传输协议来传输数据(类似 xml,而且大有取代 xml 的趋势),而网站后台代码必须与之配合使用。PHP 是用 json_encode 函数来对返回的数组数据进行编码的,但这个函数只有 PHP5.2版本以上才支持。

从网上找到一个 json 的操作类,本人在 PHP4.4.7 版本下测试通过。本人还建了个函数 function my_json_encode($phparr),使代码兼容 PHP5.2 以上版本。

示例代码(包括 json 的类包软件)可以在以下网址下载:http://download.csdn.net/source/810895

以下是全部代码:

    
    
    <title>jQuery Ajax 实例演示</title>
    
    <script language="”javascript”" src="%E2%80%9D../lib/jquery.js%E2%80%9D"></script>
    <script language="”javascript”">

    $(document).ready(function ()
    {
    $(‘#send_ajax’).click(function (){
    var params=$(‘input’).serialize(); //序列化表单的值
    $.ajax({
    url:’ajax_json.php’, //后台处理程序
    type:’post’,         //数据发送方式
    dataType:’json’,     //接受数据格式
    data:params,         //要传递的数据
    success:update_page //回传函数(这里是函数名)
    });
    });

    //$.post()方式:
    $(‘#test_post’).click(function (){
    $.post(
    ‘ajax_json.php’,
    {
    username:$(‘#input1′).val(),
    age:$(‘#input2′).val(),
    sex:$(‘#input3′).val(),
    job:$(‘#input4′).val()
    },
    function (data) //回传函数
    {
    var myjson=”;
    eval(‘myjson=’ + data + ‘;’);
    $(‘#result’).html(“姓名:” + myjson.username + “<br/>工作:” + myjson['job']);
    }
    );
    });

    //$.get()方式:
    $(‘#test_get’).click(function ()
    {
    $.get(
    ‘ajax_json.php’,
    {
    username:$(“#input1″).val(),
    age:$(“#input2″).val(),
    sex:$(“#input3″).val(),
    job:$(“#input4″).val()
    },
    function(data) //回传函数
    {
    var myjson=”;
    eval(“myjson=” + data + “;”);
    $(“#result”).html(myjson.job);
    }
    );
    });
    });

    function update_page (json) //回传函数实体,参数为XMLhttpRequest.responseText
    {
    var str=”姓名:”+json.username+”<br />”;
    str+=”年龄:”+json.age+”<br />”;
    str+=”性别:”+json.sex+”<br />”;
    str+=”工作:”+json.job+”<br />”;
    str+=”追加测试:”+json.append;
    $(“#result”).html(str);
    }
    </script>
    

    <div id="”result”" style="”background:orange;border:1px" solid red></div>
    
Copy after login

输入姓名:

输入年龄:

输入性别:

输入工作:


PHP 文件 ajax_json.php:
    <?php //$arr = $_POST; //若以$.get()方式发送数据,则要改成$_GET.或者干脆:$_REQUEST
    $arr = $_REQUEST;
    $arr['append'] = ‘测试字符串’;
    //print_r($arr);
    $myjson = my_json_encode($arr);
    echo $myjson;

    function my_json_encode($phparr)
    {
    if(function_exists(“json_encode”))
    {
    return json_encode($phparr);
    }
    else
    {
    require_once ‘json/json.class.php’;
    $json = new Services_JSON;
    return $json->encode($phparr);
    }
    }
    ?>
Copy after login


Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!