2013-02-22 15 views
9

Oto Jquery, aby wymusić maksymalną długość dla textarea po dodaniu atrybutu "maxlength". Maksymalna długość nie jest obsługiwana w IE. Jak dostosować mój kod do obsługi wielu obszarów tekstowych na stronie? Obecnie , jeśli dodaję tekst do dowolnego obszaru tekstowego, wszystkie odliczają z tą samą wartością.Jquery pomaga wymusić maksymalną długość na polu tekstowym?

Jquery:

$(document).ready(function() { 

maxLength = $("textarea").attr("maxlength"); 
    $("textarea").after("<div><span id='remainingLengthTempId'>" 
       + maxLength + "</span> remaining</div>"); 

    $("textarea").bind("keyup change", function(){checkMaxLength(this.id, maxLength); }) 

}); 

function checkMaxLength(textareaID, maxLength){ 

    currentLengthInTextarea = $("#"+textareaID).val().length; 
    $(remainingLengthTempId).text(parseInt(maxLength) - parseInt(currentLengthInTextarea)); 

    if (currentLengthInTextarea > (maxLength)) { 

     // Trim the field current length over the maxlength. 
     $("textarea").val($("textarea").val().slice(0, maxLength)); 
     $(remainingLengthTempId).text(0); 

    } 
} 

HTML:

Skills: 
<textarea id="1" maxlength="200" rows="10" cols="60" ></textarea> 

Postions: 
<textarea id="2" maxlength="200" rows="10" cols="60" ></textarea> 

Comments 
<textarea id="3" maxlength="100" rows="10" cols="60" ></textarea> 
+0

http://api.jquery.com/each – Blazemonger

+2

http://keith-wood.name/maxlength.html –

+0

Balzemonger..Gdzie by każdy był używany? – Chaka

Odpowiedz

14

To najlepsze rozwiązanie! Włóż to do tagu skryptu w kodzie HTML

$("textarea[maxlength]").on("propertychange input", function() { 
    if (this.value.length > this.maxlength) { 
     this.value = this.value.substring(0, this.maxlength); 
    } 
}); 

i teraz używać <textarea maxlength="{your limit}"></textarea> dla {your limit} limitu znakow.

+0

czy to jest maksymalna długość rzeczy DOM expando? lub czy maxlength jest poprawną właściwością javascript dla elementów wejściowych i tekstowych? – Matt

9

Rozwiązaniem jest tutaj:

http://web.enavu.com/daily-tip/maxlength-for-textarea-with-jquery/

$(document).ready(function() { 

    $('textarea[maxlength]').keyup(function(){ 
     //get the limit from maxlength attribute 
     var limit = parseInt($(this).attr('maxlength')); 
     //get the current text inside the textarea 
     var text = $(this).val(); 
     //count the number of characters in the text 
     var chars = text.length; 

     //check if there are more characters then allowed 
     if(chars > limit){ 
      //and if there are use substr to get the text before the limit 
      var new_text = text.substr(0, limit); 

      //and change the current text with the new text 
      $(this).val(new_text); 
     } 
    }); 

}); 
1

nie można użyć tego:

class="validate[required,maxSize[50]] " 
+1

Możesz chcieć sprawdzić ten link .. jest "nieco" zepsuty .. – DerDu

0

To rozwiązanie działa jako natywny HTML tekstowym powierzchni, własności MAX-Length

Var MaxLength=100; 
$('#Selector').keydown(function (e) { 
      var text = $(this).val(); 
      var chars = text.length; 
      if (chars > MaxLength) { 
       if (e.keyCode == 46 || e.keyCode == 8 || e.keyCode == 37 || e.keyCode == 38 || e.keyCode == 39 || e.keyCode == 40) { 
        return true; 
       } 
       return false; 
      } 
      return true; 
     }); 

Nie ustawić właściwość MaxLength w kontroli po stronie serwera (ASP: TextBox) jako serwer nie będzie konwertować właściwości maxLength na znaczniki HTML po powrocie do przeglądarki.

Powiązane problemy