jQuery .find () для данных из вызова .ajax () возвращает "[объектный объект]" вместо div

Question

Попытка найти элемент div с id="result" в возвращенных данных из .ajax() с использованием .find(). К сожалению, 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]
    }
});

Answer 1

Чтобы конкретно ответить на ваш вопрос, похоже, он работает правильно. Вы сказали, что он возвращает [object Object], что jQuery вернет с помощью метода find("#result"). Он возвращает элемент jQuery, который соответствует запросу find.

Попробуйте получить атрибут этого объекта, например 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');

Answer 2

Я просто потратил 3 часа, чтобы решить подобную проблему.Это то, что сработало для меня.

Элемент, который я пытался извлечь из моего ответа $.get, был первым дочерним элементом тега body.По какой-то причине, когда я обернул div этим элементом, он стал доступным через $(response).find('#nameofelement').

Не знаю, почему, но да, извлекаемый элемент не может быть первым потомком тела ... это может быть полезно кому-то)

Answer 3

попробуйте это:

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

кстати alert - грубый способ отладки, попробуйте console.log

Answer 4

это ваш ответ:

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

Следующее jQuery не будет работать:

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

, так как div - это элементы верхнего уровня, а данные - это не элемент, а строка, для его работы необходимо использовать .filter

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

Еще один и тот же вопрос: Использовать селекторы Jquery в HTML, загруженном $ .AJAX?

Answer 5

не забудьте сделать это с разбора html.вроде:

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

должно работать :)

Answer 6

Это сработало для меня, вам просто нужно поставить .html () в конце - $ (response) .find ("# result")

Answer 7

Функция jQuery find () возвращает объект jQuery, который упаковывает объект DOM.Вы должны быть в состоянии работать с этим объектом, чтобы делать то, что вы хотели бы с div.

Answer 8

Дело в том, что ваш ajax ответ возвращает строку , поэтому, если вы используете напрямую $ (ответ) будет возвращено JQUERY: Uncaught Error: синтаксическая ошибка, нераспознанное выражение в консоли. Для правильного использования вам необходимо сначала использовать встроенную функцию JQUERY, которая называется $. ParseHTML (response) . Как следует из названия функции, вам нужно сначала проанализировать строку как 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 
    }
});

Answer 9

Вы можете сделать это таким образом, чтобы найти любой div и получить его атрибуты или что угодно.

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

или

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

Answer 10

Для просмотра содержимого в оповещении используйте:

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