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 相关文章推荐
js 键盘记录实现(兼容FireFox和IE)
Feb 07 Javascript
js客户端快捷键管理类的较完整实现和应用
Jun 08 Javascript
javascript innerHTML使用分析
Dec 03 Javascript
基于jquery的15款幻灯片插件
Apr 10 Javascript
JavaScript中常用的运算符小结
Jan 18 Javascript
关于锚点跳转及jQuery下相关操作与插件
Oct 01 Javascript
jQuery显示和隐藏 常用的状态判断方法
Jan 29 Javascript
jQuery解决input元素的blur事件和其他非表单元素的click事件冲突问题
Aug 15 Javascript
浅谈js基础数据类型和引用类型,深浅拷贝问题,以及内存分配问题
Sep 02 Javascript
AngularJS的$location使用方法详解
Oct 19 Javascript
JS获取动态添加元素的方法详解
Jul 31 Javascript
详解vue高级特性
Jun 09 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制作静态网站的模板框架(二)
2006/10/09 PHP
Laravel 4.2 中队列服务(queue)使用感受
2014/10/30 PHP
详解WordPress中添加友情链接的方法
2016/05/21 PHP
对PHP依赖注入的理解实例分析
2016/10/09 PHP
PHP获取文件扩展名的方法实例总结
2017/06/10 PHP
JQuery的AJAX实现文件下载的小例子
2013/05/15 Javascript
键盘上一张下一张兼容IE/google/firefox等浏览器
2014/01/28 Javascript
js this函数调用无需再次抓获id,name或标签名
2014/03/03 Javascript
jQuery实现视频作为全屏幕背景
2014/12/18 Javascript
跟我学习javascript的隐式强制转换
2015/11/16 Javascript
浅谈JavaScript 执行环境、作用域及垃圾回收
2016/05/31 Javascript
详细讲解vue2+vuex+axios
2017/05/27 Javascript
微信小程序的分类页面制作
2017/06/27 Javascript
jQuery使用ajax_动力节点Java学院整理
2017/07/05 jQuery
vue实现在表格里,取每行的id的方法
2018/03/09 Javascript
详解Vue中watch的高级用法
2018/05/02 Javascript
js实现录音上传功能
2019/11/22 Javascript
详解Python计算机视觉 图像扭曲(仿射扭曲)
2019/03/27 Python
解决Python二维数组赋值问题
2019/11/28 Python
如何在django中添加日志功能
2020/02/06 Python
python实现串口通信的示例代码
2020/02/10 Python
PyPDF2读取PDF文件内容保存到本地TXT实例
2020/05/12 Python
PyCharm中关于安装第三方包的三个建议
2020/09/17 Python
详解CSS的border边框属性及其在CSS3中的新特性
2016/05/10 HTML / CSS
美国狗旅行和户外用品领先供应商:kurgo
2020/08/18 全球购物
应届生服装设计自我评价
2013/09/20 职场文书
学校大课间活动方案
2014/01/30 职场文书
文员求职信
2014/07/15 职场文书
小区门卫岗位职责范本
2014/08/24 职场文书
领导班子个人查摆问题对照检查材料
2014/10/02 职场文书
领导干部作风整顿个人剖析材料
2014/10/11 职场文书
2014年优质护理服务工作总结
2014/11/14 职场文书
遇事可以测出您的见识与格局
2019/09/16 职场文书
Golang生成Excel文档的方法步骤
2021/06/09 Golang
python blinker 信号库
2022/05/04 Python
CSS link与@import的区别和用法解析
2023/05/07 HTML / CSS