web-dev-qa-db-ja.com

jQueryでAjaxリターンデータを抽出する

JQueryとAjaxを実行しましたが、応答をDiv要素に入れることができません。これはコードです:

Index.html

$.ajax({
    type:"POST",
    url: "ajax.php",
    data:"id="+id ,
    success: function(html){
        $("#response").html(data);
    }
});

<div id="response"></div>への応答を受信して​​います。

ajax.phpは、次のコードをindex.htmlファイルに返します。

<div id ="one"> OneVal </div>
<div id ="sub"> SubVal </div>

OneValとSubvalを変数に抽出できますか?上記の応答の代わりに「OneVal」と「SubVal」を抽出するにはどうすればよいですか?

42
venkatachalam

応答から作成されたjQueryオブジェクトで.filterを使用できます。

success: function(data){
    //Create jQuery object from the response HTML.
    var $response=$(data);

    //Query the jQuery object for the values
    var oneval = $response.filter('#one').text();
    var subval = $response.filter('#sub').text();
}
83
redsquare

変更 .findから.filter...

17
redsquare

あなたの成功関数にはパラメータ「html」があり、要素に「データ」を追加しようとしていることに気づきましたhtml()...これらが一致するように変更してください:

$.ajax({
    type:"POST",
    url: "ajax.php",
    data:"id="+id ,
    success: function(data){
        $("#response").html(data);
    }
});
12
VinnyBenson

次の例のようにjsonを使用できます。

[〜#〜] php [〜#〜] コード:

echo json_encode($array);

$arrayは配列データであり、jQueryコードは次のとおりです。

$.get("period/education/ajaxschoollist.php?schoolid="+schoolid, function(responseTxt, statusTxt, xhr){
    var a = JSON.parse(responseTxt);
    $("#hideschoolid").val(a.schoolid);
    $("#section_id").val(a.section_id);
    $("#schoolname").val(a.schoolname);
    $("#country_id").val(a.country_id);
    $("#state_id").val(a.state_id);
}
3
aya

JQuerycontextパラメーターを使用することもできます。 ドキュメントへのリンク

セレクターコンテキスト

デフォルトでは、セレクタはドキュメントルートから開始してDOM内で検索を実行します。ただし、$()関数にオプションの2番目のパラメーターを使用すると、検索用の代替コンテキストを指定できます

したがって、次のこともできます。

success: function(data){
    var oneval = $('#one',data).text();
    var subval = $('#sub',data).text();
}
2
Rel