Question

我有这样的功能：

$.fn.filterByClass = function(cls) {
    var o = $(this);
    return o.filter(function() {
      if ($(this).attr("class") == cls) {
        return $(this);
      }
    });
  };

如果我有多个表单，我会创建一个这样的选择器：

$form = $('form');

然后在我的代码中我需要过滤它们：

$form_one = $form.filterByClass('mykls');

我得到了正确的元素，一切都按照我的意愿运作。但是，当我想在此内搜索“过滤”时。形式如：

$form_one.find('div')

我收到此错误：

TypeError: undefined is not a function
---------------
message: "undefined is not a function"
stack: (...)
get stack: function () { [native code] }
set stack: function () { [native code] }
__proto__: Error

但是如果我直接按类名选择而不是像这样过滤它：

$form_one = $('form.mykls');

然后：

$form_one.find('div')

没有任何问题。为什么会这样？我做错了什么？

我应该使用某种grepping /过滤来获得正确的形式，我不能直接查看给定的类，但我省略了那部分，因为它无关紧要。

修改：

以下是代码的包装：

var myApp = myApp || {};

myApp.filters = (function($){
  $.fn.filterByClass = function(cls) {
    var o = $(this);
    return o.filter(function() {
      if ($(this).attr("class") == cls) {
        return $(this);
      }
    });
  };

  var $wrapper = $('#notification_filters'),
      $form = $('form', $wrapper);

  var init = function(options) {
    $currentForm = $form.filterByClass(options.formClass);
    console.log($currentForm.find('div')); 
  };

return {
    init: init
  };
})(jQuery);

Answer 1

您的filterByClass方法返回一个应该具有find方法的jQuery对象。我无法重现错误。

如果要过滤具有特定className的元素，可以使用filter方法：

$collection.filter('.className');

另请注意，您不必在方法中创建jQuery对象，因为this已经是jQuery集合，您应该在filter回调中返回一个布尔值，这是一个真实的value保留元素，而falsy值从集合中删除元素。

$.fn.filterByClass = function(cls) {
    // `this` refers to a jQuery collection
    return this.filter(function() {
        // `this` here refers to the current raw Element object
        return this.className === cls;
    });
};

请注意，上面的方法返回只有cls className的元素。要过滤其某个classNames为cls的元素，您可以使用String.prototype.indexOf方法或jQuery hasClass方法。

return this.className.indexOf(cls) > -1;

或者为了避免不正确的匹配：

return $.inArray(this.className.split(/\s/g), cls) > -1;

jQuery过滤器函数选择器错误

1 个答案: