2010-02-17 3 views
6

스크립트 사용 해제 http://viralpatel.net/blogs/2008/12/set-maxlength-of-textarea-input-using-jquery-javascript.html 텍스트 영역의 입력을 1000 자로 제한하려고합니다. 프로토 타입도이 페이지에 포함되어 있습니다.jQuery를 사용하는 텍스트 영역의 최대 길이

그것은 크롬에서 잘 작동하지만 파이어 폭스에서 다음과 같은 오류가 주어지고 입력이 제한되지 않습니다

$("textarea[maxlength]") is null 

나는 완전히 난처한 상황에 빠진입니다. 어떤 도움을 주시면 감사하겠습니다. 코드 스 니펫이 이어집니다.

텍스트 영역 :

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

자바 스크립트 :

<%= 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

동일한 질문에 jquery.maxlength.js을 변경해야 noConflict() mode로 설정되어 있기 때문에 : - [저에게 물어]) 이것을보십시오. http://stackoverflow.com/questions/1125482/how-to-impose-maxlength-on-textarea-in-html-javascript –

+0

이것은 정말로 같은 질문이 아닙니다. 그는 이미 솔루션을 가지고 있으며 jQuery 파트를 작동시키는 데 문제가 있습니다. –

+0

같은 질문이 정확하지 않습니다. OP는 특별히 jquery에 대해 묻고 있습니다 : D – Jared

답변

6

이 당신의 jquery.maxlength.js 파일을 랩 :

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

$().maxlength()으로 전화 할 때 $ 변수를 사용하려하지만 다른 범위에서 더 이상 jQuery과 같지 않습니다. 익명 함수를 실행 자체에 플러그인을 배치함으로써, 개인 범위를 만듭니다 곳 $ = jQuery

+0

+1 여분의 단계로 이동하고 anon func 및 var 범위 지정을 설명합니다. – Jared

+0

아, 알겠습니다. 나는 익명 함수의 문법을 완전히 이해하지 못한다. jQuery 객체는 어떻게 '$'로 전달 될까? (function ($) {...}) (jQuery) – Cam

+0

@Cam은 JS가 작동하는 방식에 대한 구문입니다. 예를 들어 마지막 괄호에서 쉼표로 구분 된 세 개의 항목을 취하기 때문에'(function (a, b, c) {alert (a + b + c);}) (1,2,3) 함수에 매개 변수로 전달합니다. 희망이 조금 도움이됩니다. –

3

jQuery를 사용하면

(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은 다른 자격이 있습니다. 이게 문제 야. Chrome에서 왜 작동하는지 궁금합니다. 크롬에 범위 정의가 다른지 궁금합니다. –