textarea的最大长度不适用于IE8

时间:2013-06-04 02:48:07

标签: javascript jquery html textarea maxlength

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

为了解决这个问题我从这里尝试了一个解决方案,它使用了另一个用于表示textarea的函数:

//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>

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

4 个答案:

答案 0 :(得分:12)

问题中的代码在达到限制时有效禁用键盘输入。要对粘贴的内容施加限制,您还需要处理其他事件。以下代码将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>

答案 1 :(得分:1)

对于某些历史记录,textarea上的maxlength是一个新的HTML5功能,仅在IE 10中首次支持.IE 9及以下版本从未支持过它。

答案 2 :(得分:1)

使用此代码,它将适用于IE 9以下版本。只更改if condtion中的版本。

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

答案 3 :(得分:-2)

只需添加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>