需求:

  移动端用户反馈功能,有的用户反馈功能是有字数限制的,比如限制为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. js模块加载之AMD和CMD

    当我写这篇文章的时候,sea.js已经逐渐退出历史的舞台,详细链接.不过任何新事物的出现都是对旧事物的取其精华,去其糟粕,所以了解一下以前模块的加载也是一件好事. js模块化的原因自不比多说,看看HU ...

  2. ZigZag - 曲折字符串

    需求:将所给的字符串以“倒N型”输出,可以指定输出的行数函数 String convert(String s, int numRows)例如输入“abcdefghijklnmopqrstuvwxyz” ...

  3. hdu_5964:平行四边形

    打重现赛时,一点思路也没有,然后又看到这题AC数那么少,就直接放弃了.今天重新看了看,借鉴了下别人的,发现此题应该算是一道可解题. 看上去,这题的ans是同时有两个点作为自变量的函数(然而n^2复杂度 ...

  4. HTML5之placeholder属性以及如何更改placeholder属性中文字颜色

    今天在群里看到群友问了一个这样的问题,就是如何更改placeholder属性中文字的颜色,以前用过这属性,却是没更改过颜色,于是便试了试,中途遇到些问题,查找资料后特来总结一下. 熟悉HTML5的人应 ...

  5. 电脑装windows与Centos双系统时引导问题

    (本文对电脑如何装windows系统和centos系统不进行详细赘述.) 电脑装双系统时,首先要安装windows系统,在硬盘中划分一块空闲的分区,用来安装centos系统(可以借助"软碟通 ...

  6. 练习半音阶口琴--->>修理推键所感

    我想,自己现在已经是完全迷上口琴了,在最近练习的时候自己发现推键推到最后的时候,推不过去了,以为是摩擦的问题,于是刻了轨道来减少摩擦,但是效果并不是很明显,于是,自己开始起了买新口琴的心,想换个好一点 ...

  7. 用gensim学习word2vec

    在word2vec原理篇中,我们对word2vec的两种模型CBOW和Skip-Gram,以及两种解法Hierarchical Softmax和Negative Sampling做了总结.这里我们就从 ...

  8. Neo4j图数据库

    01. 图数据库 图数据库是专门存储和检索大量信息网络的存储引擎.它可以有效地将数据存储为节点和关系,并允许高性能检索和查询这些结构.属性可以添加到节点和关系.节点可以用零个或多个标签标注,关系总是定 ...

  9. 22. leetcode 242. Valid Anagram(由颠倒字母顺序而构成的字)

    22. 242. Valid Anagram(由颠倒字母顺序而构成的字) Given two strings s and t, write a function to determine if t i ...

  10. 19. leetcode 100. Same Tree

    Given two binary trees, write a function to check if they are equal or not. Two binary trees are con ...