jquery 每次在迭代中添加自定义方法

Question

我有一组复选框，我想根据它们拥有的类为它们创建一个自定义方法。

var checkboxs = $("input[type=checkbox]");
    checkboxs.each(function(){
        if($(this).hasClass("class1")){
            $(this).method1 = function(){
                $(this).removeAttr("checked");
                return $(this);
            }
        }
        if($(this).hasClass("class2")){
            $(this).method1 = function(){
                $(this).parents("tr").next().hide();
                $(this).removeAttr("checked");
                return $(this);
            }
        }
    });

那么如果，我想这样做:

checkboxs.each(function(){
        $(this).method1();
    });

它告诉我没有 method1 方法。为什么这不起作用？

Answer 1

问题是 $(this) 使用 this 变量创建了一个新的 jQuery 对象。每次调用 $(this) 时都会执行此操作，因此在一个位置向 $(this) 添加方法不会使该方法在后续调用 中最后出现$(这个).

这个jsFiddle显示了问题http://jsfiddle.net/92cub/1/

编辑:我认为每个元素的函数可能不同，我已更改给定的代码以使用 jQuery 中的 data 函数。另外，您重复执行 $(this) 所以我删除了它。一遍又一遍地调用 $(this) 非常繁重。

相反，你可以这样做:

var checkboxs = $("input[type=checkbox]");
    checkboxs.each(function(){
      var $this = $(this);  

      if($this.hasClass("class1")){
           $this.data("func", function (){
                $this.removeAttr("checked");
                return $this;
            });
        }
        if($this.hasClass("class2")){
            $this.data("func", function(){
                $this.parents("tr").next().hide();
                $this.removeAttr("checked");
                return $this;
            });
        }
    });

要调用该函数，请使用:

checkboxs.each(function(){
    $(this).data("func").apply();      
});