jQuery: как отправить $ (this) в качестве параметра плагина - PullRequest
Новая
       26

jQuery: как отправить $ (this) в качестве параметра плагина

0 голосов
/ 10 февраля 2012

Я создал плагин jQuery, который управляет входным контентом (max chars, preg match, ...). И я хотел бы использовать это так: 

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

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

});

Это означает, что плагин берет все текстовые области с классом "count-chars" и отображает символы обратного отсчета в блоке div с с тем же идентификатором, что и соответствующий textarea + "-chars-left", И здесь проблема в том ...

console.log показал, что $ (this) .attr ("id") относится к undefined !!!

Итак: Как я могу использовать атрибуты входа (например) в качестве параметра плагина?

Вот плагин: http://github.com/hassinus/smartInput

Заранее спасибо.

Ответы [ 3 ]

1 голос
/ 10 февраля 2012

Единственное, о чем я могу думать сейчас, это использовать .each()

$("form textarea.count-chars").each(function() {
    var ta = $(this);
    ta.smartInput({
        counterDiv: "#" + ta.attr("id") + "-chars-left",
        maxChars: 128
    });
});
1 голос
/ 10 февраля 2012

Вы не можете установить this там.

Только в обратных вызовах.

0 голосов
/ 10 февраля 2012

Причина, по которой $(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"); }
});
...