最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Max length of textarea is not working on IE8 - Stack Overflow

programmeradmin2浏览0评论

From research on internet, max length attribute is not working on IE 8 and 9

To resolve the problem I tried a solution from here , it use with the other function which is for presentation 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>

The problem is , The textarea is not able to input any character after it exceed the 2000 in IE8 9 , but I can still use the copy and paste function which will exceed the textarea limit. How to fix this? thanks

From research on internet, max length attribute is not working on IE 8 and 9

To resolve the problem I tried a solution from here , it use with the other function which is for presentation 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>

The problem is , The textarea is not able to input any character after it exceed the 2000 in IE8 9 , but I can still use the copy and paste function which will exceed the textarea limit. How to fix this? thanks

Share Improve this question asked Jun 4, 2013 at 2:48 user1871516user1871516 1,0096 gold badges15 silver badges26 bronze badges 2
  • sorry. It seems onpaste="return false" fixed the problem – user1871516 Commented Jun 4, 2013 at 2:50
  • 1 it's very easy using length <textarea name="question" cols="100" rows="8" maxlength="500px" onKeyPress="return ( this.value.length < 1000 );"></textarea> – Sender Commented Jun 4, 2013 at 4:53
Add a comment  | 

4 Answers 4

Reset to default 13

The code in the question effectively disables typing from keyboard when the limit has been reached. To impose the restriction on pasted content too, you need to handle other events, too. The following code truncates the textarea content to the given length. This is not good usability (you should probably signal an attempt to exceed the limit, instead of silent truncation, and you could have a character counter on the page to help the user), but it does what was asked for:

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

Just for some hstory on this, maxlength on a textarea is a new HTML5 feature which was only first supported by IE in 10. IE 9 and below never supported it.

Use this code it will work for below IE 9 version. only change version in 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);
                                        }
                                    });
                                }

Simply add onpaste fixed the problem

<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>
发布评论

评论列表(0)

  1. 暂无评论