Textarea输入字数限制的简单示例(兼容iOS、安卓)

发布时间：2020-12-14 21:23:16 所属栏目：资源来源：网络整理

导读：感兴趣的小伙伴，下面一起跟随编程之家 jb51.cc的小编两巴掌来看看吧！最近在做一个微信公众号的页面，其中有对textarea做输入字数限制，而且需要兼容iOS和安卓手机，下面直接贴代码： !DOCTYPE htmlhtml lang="en"head meta charset="UTF-8" titletextarea

感兴趣的小伙伴，下面一起跟随编程之家 52php.cn的小编两巴掌来看看吧！

最近在做一个微信公众号的页面，其中有对textarea做输入字数限制，而且需要兼容iOS和安卓手机，

下面直接贴代码：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>textarea输入字数限制（兼容ios和安卓）</title>
</head>

<body>
  <!-- 最多输入10个字 -->
  <textarea placeholder="请输入家庭地址（必填）" rows="2"></textarea>
  <textarea placeholder="请输入家庭地址（必填）" rows="2"></textarea>
  <textarea placeholder="请输入家庭地址（必填）" rows="2"></textarea>
  <textarea placeholder="请输入家庭地址（必填）" rows="2"></textarea>
  <textarea placeholder="请输入家庭地址（必填）" rows="2"></textarea>
  <textarea placeholder="请输入家庭地址（必填）" rows="2"></textarea>
  <script>
  var textarea = document.getElementsByTagName('textarea');
  for (var i = 0; i < textarea.length; i++) {
    textarea[i].oninput = function() {//注意，这里要用oninput,不要用onkeyup,否则iOS系统不支持
      this.value = this.value.substring(0,10);
    }
  }
  </script>
</body>

</html>
<!--end  End 52php.cn()-->

遇到的坑：刚开始用onkeyup，发现iOS系统不支持，改用oninput，测试OK。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!