需求:

  移动端用户反馈功能,有的用户反馈功能是有字数限制的,比如限制为200字

解决方法:

  在项目中我们使用的Vue框架,所以可以直接进行绑定,代码如下

<section class="opinion">
  <textarea class="issue" id="issue" name="issue" placeholder="请输入" v-model="inputtext" maxlength="200"></textarea>
  <div class="count"><div class="num"><i id="counter">{{sum}}</i>/200</div></div>
</section>

computed:{
  sum:function(){
    return this.inputtext.length
  }
}
其中有一个问题:由于该方法限制长度为200,所以当输入到200时将禁止写入文本框,当使用ios 26键盘拼音出入汉字时输入过程中比如输入到第199个字再输第200个字时只输入第一个字母就无法继续输入了,因为每个字母就相当于占用了一个字符

H5输入框实时记录文字个数的更多相关文章

  1. jquery的实时触发事件(textarea实时获取中文个数)

    jquery的实时触发事件(textarea实时获取中文个数) (2014-09-16 11:49:50) 转载▼ 标签: 实时触发事件 中文个数 onpropertychange oninput o ...

  2. 历史命令与实时记录(redhat6.8)

    历史命令与实时记录(redhat6.8) linuxshell 2018年02月13日 10时58分53秒 参数 HISTTIMEFORMAT HISTSIZE HISTFILESIZE HISTFI ...

  3. oninput、onchange与onpropertychange事件的区别, 与input输入框实时检测

    这几天项目着急,同时也学到好多以前没有接触过的知识.oninput.onchange与onpropertychange事件的区别, 与input输入框实时检测 onchange事件只在键盘或者鼠标操作 ...

  4. 让input表单输入框不记录输入过信息的方法

    有过表单设计经验的朋友肯定知道,当我们在浏览器中输入表单信息的时候,往往input文本输入框会记录下之前提交表单的信息,以后每次只要双击input文本输入框就会出现之前输入的文本,这样有时会觉得比较方 ...

  5. js对输入文字个数的限制...

    发表留言或者微博的时候,对输入文字个数的限制,下面分两种情况,每种分别介绍两种实现方式: 第一种:一个汉字算一位,两个字母或符号算一位. 通过ASCII编码来判断 textarea.onkeyup = ...

  6. javascript实现记录文本框内文字个数

    最近在做一个项目中遇到这样一个问题,要对文本框中用户输入的文字进行记数,在下面显示出来,因为我们做的是一个短信发送平台,现在我们国家的短信服务,如果你的信息超过了70个字符,短信就会按二条给你下发.所 ...

  7. 一个数字键盘引发的血案——移动端H5输入框、光标、数字键盘全假套件实现

    https://juejin.im/post/5a44c5eef265da432d2868f6 为啥要写假键盘? 还是输入框.光标全假的假键盘? 手机自带的不用非得写个假的,吃饱没事干吧? 装逼?炫技 ...

  8. web杂记-禁止输入框自动填充文字

    1:背景 公司基于业务需求开发了一套纯JS的时间控件,本来用得好好得.后来发现在部分浏览器下使用该时间控件会出现输入框自动填充的部分与控件的展示产生了冲突: 如图: 2:问题分析 因为部分浏览太人性化 ...

  9. Js制作点击输入框时默认文字消失的效果

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-02-17) 为了提高用户体验和易用度,一些设计师会对网页中用户经常用的东西进行优化,比如输入框.一般的输入框是怎样优化的呢 ...

随机推荐

  1. Phpcms 前台页面实现分页

    phpcms开发就是模仿里面原有的方法进行扩展,前台要实现分页,就去找后台页面的分页实现. 如后台 扩展->后台操作日志,就有分页展示. 1.先去添加自己的分页方法(千万不要在原来的方法上修改, ...

  2. xdu_1048:二分匹配模板测试

    二分匹配的模板题,这里用网络流模板(见刘汝佳<算法竞赛入门经典·训练指南>P359 Dinic算法)做. 将男女生均看做网络上的节点,题中给出的每个"关系"看做一条起点 ...

  3. 修改User-Agent来伪装浏览器访问手机站点

    有时候为了测试需要,可能需要使用测试手机wap这样的站点,如果用真正的手机去测试也可以实现,但是比较麻烦,我们可以通过设置chrome的user agent来伪装浏览器,达到我们的测试目的. 代码如下 ...

  4. Let's Encrypt与DNS轮循

    本文由网络安全研究员.securityheaders.io和report-uri.io创始人Scott Helme发布在其个人博客中.描述了如何使用Let's Encrypt的同时兼容DNS轮循. 早 ...

  5. js 带遮罩层的弹出层

    最近有个小伙伴问我关于mui的带遮罩层的弹出层,我给他发了个相关demo,但是因为他是新手的原因没有看懂,所以我写了一个单纯的原生的带遮罩层的弹出层dome.写这篇微博希望可以帮到需要的小伙伴. &l ...

  6. 给ubuntu的swap分区增加容量

    1.创建一个 Swap 文件. mkdir swap cd swap sudo dd if=/dev/zero of=swapfile bs=1024 count=100000 出现下列提示,上面命令 ...

  7. web项目-easyui-datagrid使用汇总

    一,引言 工作的需要,做了3年的wpf--,又因为项目的需求,回归到web的开发. ■  3 years ago,vue是我三年前没用过的玩意儿. ■  3 years ago,bootstrap组件 ...

  8. TransactionTemplate编程式事务管理方式的进阶使用---自定义拓展模板类

    1, 前面一篇的文章介绍了TransactionTemplate的基本使用方法. 同事在其基础上又做了一层封装,这样更贴合本公司的业务与规范. 2, 首先定义了两个接口: ServiceTemplat ...

  9. jsp 之 解决 Mysql net start mysql启动,提示发生系统错误 5 拒绝访问的问题

    在dos下运行net start mysql时 !!!提示发生系统错误 5:拒绝访问!只要切换到管理员模式就可以启动了. 所以我们要以管理员身份来运行cmd程序来启动mysql. 1.在开始菜单的搜索 ...

  10. iOS设置圆角的常用方法

    //第一种方法:最常用的方法,但是性能最差 UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 100 ...