2010-02-17 34 views
6

關閉腳本http://viralpatel.net/blogs/2008/12/set-maxlength-of-textarea-input-using-jquery-javascript.html我想限制輸入一個textarea到1000個字符。原型也包含在頁面中。最大長度在textarea使用jQuery

它工作在鉻罰款,但在Firefox中給出以下錯誤和輸入不限於:

$("textarea[maxlength]") is null 

我完全難倒。任何幫助,將不勝感激。代碼片段如下。

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(); 
      } 
     } 
    }); 
} 
+0

完全一樣的問題noConflict() mode: - [由我問;)]請參閱此。 http://stackoverflow.com/questions/1125482/how-to-impose-maxlength-on-textarea-in-html-javascript – 2010-02-17 05:43:46

+0

這真的不是一回事。他已經有了一個解決方案,他只是無法讓jQuery部分工作。 – 2010-02-17 05:45:49

+0

不是_完全相同的問題。 OP專門詢問jquery:D – Jared 2010-02-17 05:46:01

回答

6

環繞你jquery.maxlength.js文件在此:

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

當您致電$().maxlength()它試圖使用$變量,但在不同的範圍內,它不再等於jQuery。通過執行匿名函數包裹插件的自我,它創建了一個私人範圍,其中$ = jQuery

+0

+1,用於進行額外的步驟並解釋匿名函數和var範圍。 – Jared 2010-02-17 05:47:03

+0

啊,我明白了。我不完全理解匿名函數的語法,jQuery對象如何作爲'$'傳入? (功能($){...})(jQuery) – Cam 2010-02-19 20:07:54

+0

@Cam,它只是JS如何工作的語法。例如'(函數(a,b,c){alert(a + b + c);})(1,2,3)'會提醒'6',因爲它需要最後一個parens中的三個逗號分隔項,並將其作爲參數傳遞給函數。希望有點幫助。 – 2010-02-20 01:23:47

3

由於jQuery是設置爲你需要改變jquery.maxlength.js到

(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); 
+0

一個+1值得擁有另一個+1。這就是問題。我想知道爲什麼它在Chrome中起作用。我想知道Chrome是否有不同的範圍定義。 – 2010-02-17 05:49:02