$を使用します.getJSONドメイン間ajaxリクエストの実装

10742 ワード

jQueryではgetJSONを使用してリモートのJSON文字列を呼び出して取得し、JSONオブジェクトに変換します.成功した場合はコールバック関数を実行します.プロトタイプは次のとおりです.
jQuery.getJSON(url,[data],[callback])ドメイン間でJSONデータをロードします.
  • url:要求を送信するアドレス
  • data:(オプション)送信対象key/valueパラメータ
  • callback:(オプション)読み込み成功時のコールバック関数
  • 主にクライアントがサーバJSONデータを取得するために使用される.簡単な例:
    サーバスクリプト、JSONデータを返す:
    // $.getJSON.php
    
    
    
    $arr=array("name"=>"zhangsan", "age"=>20); 
    
    $jarr=json_encode($arr); 
    
    echo $jarr;

    注意2点:第一:クライアントに戻る前にPHP関数json_を使用するEncodeは、返されるデータを符号化します.第二に、クライアントに戻るのはreturnではなくechoです.
    次に、コアのクライアントコードを示します.
    <script language="javascript" type="text/javascript" src="./js/jquery.js"></script> 
    
    <script language="javascript" type="text/javascript"> 
    
    function getjs() 
    
    { 
    
      $.getJSON("$.getJSON.php", {}, function(response){ 
    
                     alert(response.age); 
    
      }); 
    
    }
    
     
    
    <input type="button" name="btn" id="btn" value="test" onClick="javascript:getjs();"/>

    PHPではJSON符号化で戻り値を返すので、ここではgetJSONでPHPファイルを呼び出してデータを取得する必要があります.また,getJSONを介して得られたデータは,responseを用いることができるオブジェクト配列になっていることにも注目できる.name,response.ageは戻り値を直感的に取得する.
    jqueryは$を提供した.getJSONの方法は、ドメイン間ajaxリクエストを実現することができますが、jqueryAPIのコンテンツが少なすぎて、$をどのように使うかです.getJSON,要求ウェブサイトはどのようなデータベースを返して$を譲ることができます.getJSONが入手しました.以下、実際の例で説明します.
    バックエンドはphpで、以下のコードが主に実現する機能の一つは予約登録のインタフェースを提供することであり、入力するデータはそれぞれユーザーの名前、連絡電話、住所である.
    /*          */
    
    case "yuyue_interface":
    
        $name = trim($_GET['name']);
    
        $phone = trim($_GET['phone']);
    
        $addr = trim($_GET['addr']);
    
        $dt = date("Y-m-d H:i:s");
    
        $cb = $_GET['callback'];
    
        if($name == "" || $name == NULL){
    
            echo $cb."({code:".json_encode(1)."})";
    
        }elseif($phone == "" || $phone == NULL){
    
            echo $cb."({code:".json_encode(2)."})";
    
        }elseif($addr == "" || $addr == NULL){
    
            echo $cb."({code:".json_encode(3)."})";
    
        }else{
    
            $db->execute("insert into tb_yuyue (realname,telphone,danwei,dt,ischeck) values ('$name','$phone','$addr','$dt',0)");
    
            echo $cb."({code:".json_encode(0)."})";
    
        }
    
        exit;
    
    break;

    次にフロントエンドの処理です.
    $(document).ready(function(){
    
        //  3           
    
        var name = "name";        //varchar  ,     8 (4   )
    
        var phone = "phone";    //varchar  ,   11 
    
        var addr = "addr";        //varchar  ,     500 (250   )
    
        $.getJSON("http://      /data.php?ac=yuyue_interface&name="+name+"&phone="+phone+"&addr="+addr+"&callback=?", function(data){
    
            if(data.code==1){
    
                //     
    
                alert("      ");
    
            }else if(data.code==2){
    
                //     
    
                alert("      ");
    
            }else if(data.code==3){
    
                //     
    
                alert("        ");
    
            }else{
    
                //     
    
                alert("    ");
    
            }
    
        });
    
    });

    バックエンドphpコードでは、渡される「&callback=?」次のように負けます.
    $cb = $_GET['callback'];
    
    echo $cb."({code:".json_encode(4)."})";

    以上は簡単な$です.getJSON試験、この試験を通じて、私たちはどのように$を使うかを学ぶことができます.getJSONは、インタフェースを作ってドメインを越えて要求する方法も学ぶことができます.
    原文住所:http://www.nowamagic.net/jquery/jquery_GetJson.php