IE9におけるtextareaのmaxlength属性の挙動

最近まで知らなかったのですが、IE9ではtextarea要素のmaxlengthは無視されます。
HTML4.01, 及びXHTML1.xではサポートされていませんでしたが、HTML5で標準化されました。
IE9では正式に実装されなかった模様。

同じ機能を使いたい場合はJSで実装します。

window.onload = function() {
  var txts = document.getElementsByTagName('textarea')

  for(var i = 0, l = txts.length; i < l; i++) {
    if(/^[0-9]+$/.test(txts[i].getAttribute('maxlength'))) {
      var func = function() {
        var len = parseInt(this.getAttribute('maxlength'), 10);

        if(this.value.length > len) {
          this.value = this.value.substr(0, len);
          return false;
        }
      }

      txts[i].onkeyup = func;
      txts[i].onblur = func;
    }
  }
}

How to impose maxlength on textArea in HTML using JavaScript

五十川 洋平(Yohei Isokawa)

五十川 洋平(Yohei Isokawa)

フロントエンドエンジニア/面白法人カヤックなどのWeb制作会社に勤務したのち、故郷の新潟に戻り独立。JSフレームワークAngularやFirebase、Google Cloud Platformを使ったWebアプリ開発が得意。 また、Udemyのプログラミング解説の講師、writer.appの自主開発や上越TechMeetupの主催などを行っています。

プロフィール

©Copyright 2022 Yohei Isokawa All Rights Reserved.