Question

我有这个jQuery代码，但是每当我在Ajax回调中的filter变量上调用data方法时，都会出现错误提示

data.filter不是函数

我还尝试用filter替换find，结果相似。如果我仅使用.html(data)，则data变量中的标记已成功添加到我的页面中。但是，由于我只需要标记的一部分，因此需要在将标记添加到页面之前通过.allMessages类选择器进行过滤。

$('body').on('click','.page-link',function (e) {
       e.preventDefault();

       var url = $(this).attr("href");
       glob = url;
       $.get(url,{type:'jquery'},function (data) {
            filter = data.filter('.allMessages');
           $("#contentMessage").html(filter).show('fast');
             targetUrl =glob;
           window.history.pushState({url: "" + targetUrl + ""},glob , targetUrl);
       });
   });

data是以下格式的HTML字符串

<html>
  ...
</html>

我已经使用console.log(data)和$("contentMessage").text(data).show('fast')验证了HTML的结构，并且能够验证是否包含完整的HTML文本，包括带有所需{的<div>元素{1}}类。

将allMessages登录到控制台后，我得到了一个长度为0（没有匹配元素）的jQuery对象。

为什么会出现此错误，我该如何解决？

Answer 1

$.get的回调函数的（第一个）参数不是jQuery对象，因此您不能在该变量上调用jQuery方法。在这种情况下，它是一个DOM字符串。最简单的解决方案是将其包装在对jQuery对象的调用中以获得jQuery对象实例：

$(data).filter('.allMessages');

但是，取决于该数据的特定格式，您可能需要在将其包装到jQuery对象中之前分别对其进行解析。

但是，在这种情况下，根据您要返回的data文本，您应该使用find：

$(data).find('.allMessages');

filter查看jQuery对象中的元素，并删除与提供的选择器不匹配的元素。它不会遍历DOM来查看子元素-只是与jQuery对象中的顶级元素匹配。

find遍历匹配集中的元素，并返回一个jQuery对象，其中包含与选择器匹配的后代-在这种情况下，这就是您想要的。

Answer 2

响应数据必须是jquery obj才能使用过滤器方法。我认为您可以尝试

$(data).filter('.allMessages');

过滤器不是jQuery代码中的函数错误

2 个答案: