Lunghezza massima nell'area di testo con jQuery

Question

Utilizzo dello script disattivato http://viralpatel.net/blogs/2008/12/set-maxlength-of-textarea-input-using-jquery-javascript.html Sto cercando di limitare l'input di una textarea a 1000 caratteri. Prototipo è anche incluso nella pagina.

Funziona bene in cromo, ma in Firefox è dato il seguente errore e l'ingresso non è limitata:

$("textarea[maxlength]") is null 

io sono completamente confusi. Qualsiasi aiuto sarebbe apprezzato. Seguono i frammenti di codice.

textarea:

<%= text_area 'project', 'description', 'cols' => 60, 'rows' => 8, 'maxlength' => 1000 %> 

javascript:

<%= javascript_include_tag "jquery", "jquery.maxlength" -%> 
<script type="text/javascript"> 
    jQuery.noConflict(); 
    jQuery(document).ready(function($) { 
    $().maxlength(); 
    }) 
</script> 

jquery.maxlength.js:

jQuery.fn.maxlength = function(){ 
    $('textarea[maxlength]').keypress(function(event){ 
     var key = event.which; 
     //all keys including return. 
     if(key >= 33 || key == 13) { 
      var maxLength = $(this).attr('maxlength'); 
      var length = this.value.length; 
      if(length >= maxLength) { 
       event.preventDefault(); 
      } 
     } 
    }); 
} 

Answer 1

avvolgere il vostro file di jquery.maxlength.js in questo:

(function($){ 
    .. existing code goes here 
})(jQuery); 

Quando si chiama $().maxlength() si sta tentando di utilizzare la variabile $, ma in un ambito diverso e non è più uguale a jQuery. Avvolgendo il plug-in self executing funzione anonima, si crea un ambito privato dove $ = jQuery

Answer 2

Poiché jQuery è impostato su noConflict() mode è necessario modificare jquery.maxlength.js a

(function($) 
    $.fn.maxlength = function(){ 
     $('textarea[maxlength]').keypress(function(event){ 
      var key = event.which; 
      //all keys including return. 
      if(key >= 33 || key == 13) { 
       var maxLength = $(this).attr('maxlength'); 
       var length = this.value.length; 
       if(length >= maxLength) { 
        event.preventDefault(); 
       } 
      } 
     }); 
    }; 
})(jQuery);