使用jquery向dom元素添加函数

我想将自定义函数添加到我的dom中具有相同类名的特定div元素。使用jquery向dom元素添加函数

像这样的事情

$(".custom-div").each(function(){ 
     $(this).newFtn = function() { 
      $(this).addClass("makeover"); 
     } 
});

所以在这里我想给newFtn添加与类名“.custom-DIV”的div元素。

经过反复试验并检查了萤火虫中的元素。我得到这个工作方式如下

$(".custom-div").each(function(){ 
     $(this).init.prototype.newFtn = function() { 
      $(this).addClass("makeover"); 
     } 
});

但是，我有这几个问题;我不确定这是为什么会起作用，并且有没有以这种方式做这件事的缺点？有人可以解释这个吗？一个抽象的解释应该没问题。

来源

2012-02-06 suraj

你为什么要这么做？您不会将函数添加到DOM元素，只是表示它们的JavaScript对象。你试图对我没有意义。为什么不直接添加类？ – Brad 2012-02-06 22:02:44

@Brad：对不起，如果我的问题没有足够具体到我的需要..我只是想保持简单..这里是我想要实现的摘要“我想创建一个使用div的自定义复选框。。因此，我想提供一个名为“disable（）”的函数，以便在调用此复选框时禁用（更改css并更改属性名称）“ – suraj 2012-02-06 23:02:39

尝试类似：

function DisableCheckBox(o) { 
    //No need for $('selector') here as 'o' is a jQuery object already. 
    o.each(function() { 
     o.addClass('makeover'); 
    //Other stuff... 
    }); 
    //optionally return o on function exit if you want to do stuff to it outside this function 
} 

DisableCheckBox($(".custom-div")); 
//or 
var chk = DisableCheckBox($(".custom-div")); //if returning 'o' above.

来源

2012-02-06 22:09:14 pete

我想你想要做的就是编写一个jQuery插件。其基本思路是这样的：

(function($) { 
    $.fn.newFtn = function() { 
     this.each(function() { 
      //Do stuff for each element in matched set 
     }); 
    }; 
})(jQuery);

然后，您可以将此方法应用于任何jQuery对象：

$(".custom-div").newFtn();

注意，这是像大多数内置的jQuery方法的工作（他们遍历匹配的元素组本身，所以通常不需要使用each）。

您可以从official tutorial开始学习更多关于jQuery插件开发的知识。

如果您确实想要简单地将一个类添加到匹配集中的所有元素中，则绝对不需要执行任何操作。只需在jQuery对象上调用addClass即可。它将适用于该对象内包含的所有元素。

来源

2012-02-06 22:03:17

'this.each（function（）{'should actually'返回this.each（function（）{'（假设你想保持链接性:)） – pete 2012-02-06 22:10:42

@pete - 非常真实。我已经链接到插件教程，所以我将它留给OP来指出其余部分！ – 2012-02-06 22:14:00

我知道添加自定义函数，以便它们可以应用于任何jQuery对象..我试图创建一个自定义复选框使用div ..所以我想提供一个名为“disable（）”的函数，以便当调用这个复选框被禁用（改变CSS并且改变一个属性名称）..因为这是非常具体的，我觉得我不应该将它作为一个函数添加到任何jQuery对象..我仍然是一个初学者，所以会采取你的建议，如何前进.. – suraj 2012-02-06 22:58:13

使用jquery向dom元素添加函数

回答

相关问题