来自 .ajax() 调用的数据上的 jQuery .find() 返回“[object Object]”而不是 div

jQuery .find() on data from .ajax() call is returning "[object Object]" instead of div

提问by Mensch

Trying to find divelement with id="result"in returned data from .ajax()using .find(). Unfortunately, alert(result)doesn't return div#result.

试图在使用返回的数据中查找div元素。不幸的是，没有返回。id="result".ajax().find()alert(result)div#result

Here is my code:

这是我的代码：

$.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]
    }
});

回答by Stephen Watkins

To answer your question specifically, it seems to be working correctly. You said that it returns [object Object], which is what jQuery will return with the find("#result")method. It returns a jQuery element that matches the findquery.

要具体回答您的问题，它似乎工作正常。你说它返回[object Object]，这是 jQuery 将返回的find("#result")方法。它返回一个与find查询匹配的 jQuery 元素。

Try getting an attribute of that object, like result.attr("id")- it should return result.

尝试获取该对象的属性，例如result.attr("id")- 它应该返回result.

---

---

In general, this answer depends on whether or not #resultis the top level element.

一般来说，这个答案取决于是否#result是顶级元素。

If #resultis the top level element,

如果#result是顶级元素，

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

find()will not work. Instead, use filter():

find()不管用。相反，使用filter()：

var $result = $(response).filter('#result');

If #resultis not the top level element,

如果#result不是顶级元素，

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

find()will work:

find()将工作：

var $result = $(response).find('#result');

回答by LiveSource

I just spent 3 hours to solve a similar problem. This is what worked for me.

我只花了3个小时来解决类似的问题。这对我有用。

The element that I was attempting to retrieve from my $.getresponse was a first child element of the body tag. For some reason when I wrapped a div around this element, it became retrievable through $(response).find('#nameofelement').

我试图从$.get响应中检索的元素是 body 标签的第一个子元素。出于某种原因，当我在这个元素周围包裹一个 div 时，它变得可以通过$(response).find('#nameofelement').

No idea why but yeah, retrievable element cannot be first child of body... that might be helpful to someone :)

不知道为什么，但是是的，可检索元素不能是 body 的第一个孩子......这可能对某人有帮助:)

回答by antpaw

try this:

尝试这个：

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

btw alertis a rough way to debug things, try console.log

顺便说一句，这alert是一种粗略的调试方法，请尝试console.log

回答by B?o Nam

this is your answer:

这是你的答案：

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

The following jQuery Won't work:

以下 jQuery 不起作用：

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

as the divs are top level elements and data isn't an element but a string, to make it work you need to use .filter

由于 div 是顶级元素，而 data 不是元素而是字符串，要使其工作，您需要使用 .filter

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

Another same question: Use Jquery Selectors on $.AJAX loaded HTML?

另一个相同的问题： 在 $.AJAX 加载的 HTML 上使用 Jquery 选择器？

回答by funny

do not forget to do it with parse html. like:

不要忘记用解析 html 来做。喜欢：

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

has to work :)

必须工作:)

回答by Steve Mather

This worked for me, you just need to put .html() on the end of - $(response).find("#result")

这对我有用，你只需要将 .html() 放在 - $(response).find("#result") 的末尾

回答by Ryan

The jQuery find() is returning a jQuery object that wraps the DOM object. You should be able to work with that object to do what you'd like with the div.

jQuery find() 返回一个包含 DOM 对象的 jQuery 对象。您应该能够使用该对象对 div 执行您想要的操作。

回答by sturzerblitz

The thing is that your ajaxresponseis returning a string, so if you use directly $(response)it would return JQUERY:Uncaught Error: Syntax error, unrecognized expressionin the console. In order to use it properly you need to use first a JQUERY built-in function called $.parseHTML(response). As what the function name implies you need to parse the string first as an html object. Just like this in your case:

问题是你的ajax响应返回一个string，所以如果你直接使用$(response)它会返回JQUERY: Uncaught Error: Syntax error, unrecognized expressionin the console。为了正确使用它，您需要首先使用一个名为$.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 
    }
});

回答by FK82

Specify dataType: "html".

指定dataType: "html"。

If you do not jQuery will guess the requested data type (check: http://api.jquery.com/jQuery.ajax/). My guess is that in your case responsewas a Stringrather than a DOMObject. Obviously DOM methods won't work on a String.

如果你不会 jQuery 会猜测请求的数据类型（检查：http: //api.jquery.com/jQuery.ajax/）。我的猜测是，在您的情况下response是 aString而不是DOMObject. 显然 DOM 方法不适用于 String。

You could test that with console.log("type of response: " + typeof response)(or alert("type of response:" + typeof response), in case you don't run Firebug)

你可以用console.log("type of response: " + typeof response)（或者alert("type of response:" + typeof response)，如果你不运行 Firebug）

回答by Heart

You can do it in this way to find any div and get its attributes or anything you want.

您可以通过这种方式找到任何 div 并获取其属性或您想要的任何内容。

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

or

或者

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