Textarea输入字数限制实例(兼容iOS&安卓)


Posted in Javascript onJuly 06, 2017

最近在做一个微信公众号的页面,其中有对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>

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

以上这篇Textarea输入字数限制实例(兼容iOS&安卓)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 对象的定义方法
Jan 10 Javascript
jQuery1.6 使用方法二
Nov 23 Javascript
jquery 触发a链接点击事件解决方案
May 02 Javascript
js Map List 遍历使用示例
Jul 10 Javascript
javascript中的window.location.search方法简介
Sep 02 Javascript
JavaScript获取当前网页最后修改时间的方法
Apr 03 Javascript
深入探秘jquery瀑布流的实现
Jan 30 Javascript
Vue插件写、用详解(附demo)
Mar 20 Javascript
JavaScript验证知识整理
Mar 24 Javascript
如何安装控制器JavaScript生成插件详解
Oct 21 Javascript
详解小程序毫秒级倒计时(适用于拼团秒杀功能)
May 05 Javascript
vue大型项目之分模块运行/打包的实现
Sep 21 Javascript
react系列从零开始_简单谈谈react
Jul 06 #Javascript
鼠标拖动改变DIV等网页元素的大小的实现方法
Jul 06 #Javascript
input框中自动展示当前日期yyyy/mm/dd的实现方法
Jul 06 #Javascript
Js自定义多选框效果的实例代码
Jul 05 #Javascript
使用 jQuery 实现表单验证功能
Jul 05 #jQuery
详解angularJS自定义指令间的相互交互
Jul 05 #Javascript
利用canvas实现的加载动画效果实例代码
Jul 05 #Javascript
You might like
php下正则来匹配dede模板标签的代码
2010/08/21 PHP
php设置session值和cookies的学习示例
2014/03/21 PHP
php文件下载处理方法分析
2015/04/22 PHP
详解PHP实现执行定时任务
2015/12/21 PHP
PHP函数import_request_variables()用法分析
2016/04/02 PHP
JavaScript 学习笔记一些小技巧
2010/03/28 Javascript
关于捕获用户何时点击window.onbeforeunload的取消事件
2011/03/06 Javascript
Fastest way to build an HTML string(拼装html字符串的最快方法)
2011/08/20 Javascript
页面图片浮动左右滑动效果的简单实现案例
2014/02/10 Javascript
js下拉选择框与输入框联动实现添加选中值到输入框的方法
2015/08/17 Javascript
D3.js实现散点图和气泡图的方法详解
2016/09/21 Javascript
json2.js 入门教程之使用方法与实例分析
2017/09/14 Javascript
vue .js绑定checkbox并获取、改变选中状态的实例
2018/08/24 Javascript
Vue实现PC端靠边悬浮球的代码
2020/05/09 Javascript
[01:24:34]2014 DOTA2华西杯精英邀请赛5 24 DK VS LGD
2014/05/25 DOTA
[47:45]DOTA2-DPC中国联赛 正赛 Phoenix vs Dragon BO3 第一场 2月26日
2021/03/11 DOTA
Python实现接受任意个数参数的函数方法
2018/04/21 Python
python 实现求解字符串集的最长公共前缀方法
2018/07/20 Python
分享Python切分字符串的一个不错方法
2018/12/14 Python
HTML5安全介绍之内容安全策略(CSP)简介
2012/07/10 HTML / CSS
保加利亚手表、香水、化妆品和珠宝购物网站:Brasty.bg
2020/04/22 全球购物
JAVA和C++的区别
2013/10/06 面试题
介绍一下linux的文件系统
2015/10/06 面试题
经贸日语毕业生自荐信
2013/11/03 职场文书
青年创业培训欢迎词
2014/01/08 职场文书
幼儿园教师奖惩制度
2014/02/01 职场文书
绩效考核实施方案
2014/03/18 职场文书
技术比武方案
2014/05/19 职场文书
应届毕业生自荐信
2014/05/28 职场文书
不尊敬老师检讨书范文
2014/11/19 职场文书
培训通知
2015/04/17 职场文书
2015年幼儿教师个人工作总结
2015/05/20 职场文书
上帝也疯狂观后感
2015/06/09 职场文书
天气温馨提示语
2015/07/14 职场文书
数据分析数据库ClickHouse在大数据领域应用实践
2022/04/03 MySQL
Nginx+Tomcat负载均衡多实例详解
2022/04/11 Servers