【问题标题】:Jquery help to enforce maxlength on textarea?Jquery帮助在textarea上强制执行maxlength?
【发布时间】:2013-02-08 12:05:24
【问题描述】:

当您添加属性“maxlength”时,Jquery 会为 textarea 强制执行 maxlength。 IE 不支持 Maxlength。如何调整我的代码以处理页面上的多个文本区域?现在 如果我将文本添加到任何文本区域,它们都会以相同的值倒计时。

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>

【问题讨论】:

标签: jquery validation textarea


【解决方案1】:

这是最好的解决方案! 将其放入 HTML 代码中的脚本标记中

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

现在使用&lt;textarea maxlength="{your limit}"&gt;&lt;/textarea&gt; 来限制{your limit} 字符数。

【讨论】:

  • 这是一个 DOM 扩展的东西吗?还是 maxlength 是 input 和 textarea 元素的合法 javascript 属性?
【解决方案2】:

解决办法在这里:

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);
        }
    });

});

【讨论】:

    【解决方案3】:

    你不能用这个吗:

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

    【讨论】:

      【解决方案4】:

      此解决方案用作原生 HTML 文本区域,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;
              });
      

      不要在服务器端控件 (asp:TextBox) 中设置 Maxlength 属性,因为服务器在返回浏览器时不会将 maxLength 属性转换为 HTML 标记。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2013-06-30
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2017-05-20
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多