【问题标题】:Max length of textarea is not working on IE8textarea 的最大长度在 IE8 上不起作用
【发布时间】:2013-06-04 02:48:06
【问题描述】:

根据互联网研究,最大长度属性不适用于 IE 8 和 9

为了解决这个问题,我从这里尝试了一个解决方案,它与另一个用于演示文本区域的功能一起使用:

//Dynamic append the textarea row
function do_resize(textArea) {
    while (
        textArea.rows > 1 &&
        textArea.scrollHeight < textArea.offsetHeight
    )
    {
        textArea.rows--;
    }
    while (textArea.scrollHeight > textArea.offsetHeight)
    {
        textArea.rows++;
    }
    textArea.rows++
}


<textarea name="q<%=countNo%>_ans" rows="3" cols="55" maxlength="2000" style="resize: none;" onkeyup="new do_resize(this);" onKeyPress="return ( this.value.length < 2000);"></textarea>

问题是,在 IE8 9 中超过 2000 的 textarea 无法输入任何字符,但我仍然可以使用超出 textarea 限制的复制和粘贴功能。如何解决这个问题?谢谢

【问题讨论】:

  • 对不起。似乎 onpaste="return false" 解决了问题
  • 使用长度很容易&lt;textarea name="question" cols="100" rows="8" maxlength="500px" onKeyPress="return ( this.value.length &lt; 1000 );"&gt;&lt;/textarea&gt;

标签: javascript jquery html textarea maxlength


【解决方案1】:

当达到限制时,问题中的代码有效地禁用了从键盘输入。要对粘贴的内容也施加限制,您还需要处理其他事件。以下代码将 textarea 内容截断为给定长度。这不是很好的可用性(您可能应该表示尝试超出限制,而不是静默截断,并且您可以在页面上设置字符计数器来帮助用户),但它可以满足要求:

<textarea maxlength=2000
  onchange="testLength(this)"
  onkeyup="testLength(this)"
  onpaste="testLength(this)"
></textarea>
<script>
var maxLength = 2000;
function testLength(ta) {
  if(ta.value.length > maxLength) {
    ta.value = ta.value.substring(0, maxLength);
  }
}
</script>

【讨论】:

    【解决方案2】:

    仅针对这方面的一些故事,textarea 上的 maxlength 是一项新的 HTML5 功能,仅在 IE 10 中才首次支持。IE 9 及更低版本从未支持它。

    【讨论】:

      【解决方案3】:

      使用此代码将适用于 IE 9 以下版本。仅在 if 条件下更改版本。

      if(navigator.appVersion.indexOf("MSIE .9")!=-1)
                                      {
                                          $('#inputid').bind('keyup blur', function () {
                                              var $this = $(this);
                                              var len = $this.val().length;
                                              var maxlength = 3;
                                              if (maxlength && len > maxlength) {
                                                  var inputvalue= $this.val().slice(0, maxlength);
                                                  $this.val("");
                                                  $this.val(inputvalue);
                                              }
                                          });
                                      }
      

      【讨论】:

        【解决方案4】:

        只需添加onpaste 即可解决问题

        <textarea name="q<%=countNo%>_ans" rows="3" cols="55" maxlength="2000" style="resize: none;" onkeyup="new do_resize(this);" onKeyPress="return ( this.value.length < 2000); onpaste="return ( this.value.length < 2000);"></textarea>
        

        【讨论】:

        • 治愈比疾病更糟糕,它是对另一个问题的回答:“我如何通过阻止用户在文本区域中粘贴文本来降低可用性?”
        • 这就是最大长度的意图
        • 不,maxlength 限制了用户输入的数量。这并不是要限制输入法,也不会那样做。
        • 感谢您的建议,您介意建议在 IE8 等旧浏览器上实现 maxlength 的最佳方法吗?
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2023-03-11
        • 1970-01-01
        • 2010-09-07
        • 1970-01-01
        • 1970-01-01
        • 2016-08-06
        • 2011-04-24
        相关资源
        最近更新 更多