Question

我创建了一个jQuery插件来管理输入内容（max chars，preg match，...）。我想这样使用它：

$("form textarea.count-chars").smartInput({

    counterDiv: "#" + $(this).attr("id") + "-chars-left",
    maxChars: 128

});

这意味着，插件会将所有textareas都带有“count-chars”类，并在div块中显示倒计时字符，其中与相应的textarea +“-chars-left”相同的id 。这里的问题是......

console.log显示 $（this）.attr（“id”）是指 undefined !!!

那么：我如何使用输入的属性（例如）作为插件参数？

以下是插件：http://github.com/hassinus/smartInput

提前致谢。

Answer 1

您无法在那里设置this。

仅在回调中。

Answer 2

我现在唯一能想到的就是使用.each()

$("form textarea.count-chars").each(function() {
    var ta = $(this);
    ta.smartInput({
        counterDiv: "#" + ta.attr("id") + "-chars-left",
        maxChars: 128
    });
});

Answer 3

您显示的代码中$(this).attr("id")未定义的原因是因为此时this与您的jQuery“form textarea.count-chars”选择器无关，因此this是不正在处理的“当前”元素。首先评估$(this).attr("id")（以及该对象文字的其余部分），然后将结果传递给您的插件。

如果您需要为每个匹配元素检索一些属性，则需要在插件中执行此操作。或者设置你的插件以获取另一个作为回调函数的参数，然后你可以提供一个函数以某种方式处理各个元素。

以下是如何操作的大致概述：

(function( $ ) {
  $.fn.smartInput = function(options) {      
     this.each(function() {
        // get associated div's id via the supplied callback,
        // passing the current element to that callback            
        var associatedDivId = options.callback.call(this,this);

        // do something with the id
     });    
  };
})( jQuery );


$(("form textarea.count-chars").smartInput({
   maxChars : 128,
   callback : function(el) { return $(this).attr("id"); }
});

jQuery：如何将$（this）作为插件参数发送

3 个答案: