web-dev-qa-db-ja.com

.ajax（）呼び出しからのデータのjQuery .find（）がdivの代わりに「[object Object]」を返す

.ajax()を使用して、.find()から返されたデータに_id="result"_を持つdiv要素を見つけようとしています。残念ながら、alert(result)は_div#result_を返しません。

ここに私のコードがあります：

_$.ajax({
    url: url, 
    cache: false,
    success: function(response) {
        result = $(response).find("#result");
        alert(response); // works as expected (returns all html)
        alert(result); // returns [object Object]
    }
});
_
jqueryajaxfind
46
Mensch

具体的にあなたの質問に答えるために、それは正しく機能しているようです。 jQueryがfind("#result")メソッドで返すものは_[object Object]_を返すと言いました。 findクエリに一致するjQuery要素を返します。

result.attr("id")など、そのオブジェクトの属性を取得してみてください-resultを返す必要があります。

一般的に、この答えは_#result_がトップレベル要素であるかどうかに依存します。

_#result_が最上位要素である場合、

_<!-- #result as top level element -->
<div id="result">
  <span>Text</span>
</div>
<div id="other-top-level-element"></div>
_

find()は機能しません。代わりに、filter()を使用します。

_var $result = $(response).filter('#result');
_

_#result_が最上位要素でない場合、

_<!-- #result not as top level element -->
<div>
  <div id="result">
    <span>Text</span>
  </div>
</div>
_

find()は機能します：

_var $result = $(response).find('#result');
_
98
Stephen Watkins

同様の問題を解決するために3時間を費やしました。これは私のために働いたものです。

_$.get_応答から取得しようとした要素は、bodyタグの最初の子要素でした。何らかの理由で、この要素の周りにdivをラップすると、$(response).find('#nameofelement')を介して取得できるようになりました。

なぜかはわかりませんが、取得可能な要素を体の最初の子にすることはできません...それは誰かに役立つかもしれません:)

28
LiveSource

これを試して：

result = $("#result", response);

btw alertは物事をデバッグする大まかな方法​​です。console.log

20
antpaw

これはあなたの答えです：

<div class="test">Hello</div>
<div class="one">World</div>

次のjQueryは機能しません。

$(data).find('div.test');

divはトップレベルの要素であり、データは要素ではなく文字列であるため、機能させるには.filterを使用する必要があります

$(data).filter('div.test');

別の同じ質問： $。AJAXで読み込まれたHTMLでJqueryセレクターを使用しますか？

8
Bảo Nam

パースHTMLでそれを行うことを忘れないでください。好む：

$.ajax({
    url: url, 
    cache: false,
    success: function(response) {
        var parsed = $.parseHTML(response);
        result = $(parsed).find("#result");
    }
});

動作する必要があります:)

6
funny

JQuery find（）は、DOMオブジェクトをラップするjQueryオブジェクトを返しています。そのオブジェクトを操作して、divで必要なことを実行できる必要があります。

3
Ryan

これは私のために働いた、あなただけの最後に.html（）を置く必要があります-$（response）.find（ "＃result"）

3
Steve Mather

この方法で任意のdivを検索し、その属性または必要なものを取得できます。

$(response).filter('#elementtobefindinresponse').attr("id");

または

$(response).filter('img#test').attr("src");
1
Heart

問題は、あなたのajaxresponseはstringを返すため、直接使用する場合$（response）戻りますJQUERY：Uncaught Error：構文エラー、コンソールの認識できない式。適切に使用するには、最初に $。parseHTML（response） と呼ばれるJQUERY組み込み関数を使用する必要があります。関数名が示すとおり、最初にhtmlオブジェクトとして文字列を解析する必要があります。あなたの場合はこのように：

$.ajax({
    url: url, 
    cache: false,
    success: function(response) {
        var parsedResponse = $.parseHTML(response);
        var result = $(parsedResponse).find("#result");

        alert(response); // returns as string in console
        alert(parsedResponse); // returns as object HTML in console
        alert(result); // returns as object that has an id named result 
    }
});
1
sturzerblitz

try if（$（response）.filter（ '＃result'）。length）//何かをする

0
Zhelyo Hristov

#result応答HTMLで？以下を試してください。 jQueryは、何も見つからない場合でも空のオブジェクトを返します。

alert(result.length);
0
Jason McCreary

dataType: "html"をリクエストに追加する必要があります。返されたhtmlがhtmlであることがわからない場合、返されたhtmlのDOMを検索できないことは確かです。

0
Fabian

次のコードを使用するだけです

var response= $(result);

$(response).find("#id/.class").html(); [or] $($(result)).find("#id/.class").html();
0
karthikeyan ganesan

ajax呼び出しがJSON配列、サーバー側からのJSON文字列を返す場合、次の操作を開始する必要があります。

$("button#submit").click(function() {
    $.ajax({
        type: "POST",
         url: "ajax_create_category",
        data: $('form#create_cat_form').serialize(),
     success: function(data)
          {
          if(data)
          {
              var jsonObj = JSON.parse(data);
              if(jsonObj.status)
              {
                $("#message").html(jsonObj.msg);
              }
            }
         }
       });
    });

JSONオブジェクトをJSオブジェクト（変数）に解析すると、データのインデックスを使用してデータを取得できます！これが皆さんの一部に役立つことを願っています！ :)

0
Randika Vishman
$.ajax({
    url: url,
    cache: false,
    success: function(response) {
        $('.element').html(response);
    }
});

< span class = "element" >
    //response
    < div id = "result" >
        Not found 
    </div> 
</span>

var result = $("#result:contains('Not found')").text();
console.log(result); // output: Not found
0
Kuldeep Gupta

_dataType: "html"_を指定します。

JQueryが要求されたデータタイプを推測しない場合（チェック： http://api.jquery.com/jQuery.ajax/ ）。私の推測では、responseはStringではなくDOMObjectでした。当然、DOMメソッドは文字列では機能しません。

Firebugを実行しない場合は、console.log("type of response: " + typeof response)（またはalert("type of response:" + typeof response)でテストできます）

0
FK82

アラートでコンテンツを表示するには：

alert( $(response).find("#result").html() );

0
Vikram