android输入法状态监听 js,中文拼音输入法在input监听的问题(监听字节数)
监听文本输入框的input 和propertychange事件，在拼写汉字(输入法)但汉字并未实际填充到文本框中(选词)时会触发input 和propertychange 事件
现在有一个需求需要监听input的框的字节数，超出10个字符或者20个字节不能继续输入了
超出10个字符或者20个字节不能继续输入
正常的情况超过十个字符的话我们可以用input 的maxlength属性，但是用length来判断的话数字和字母也会算一个length，所以在这里我们不能用这个属性
最初我的思路是：
用input 和propertychange 事件监听字节数的改变实时修改输入的字数
用jquery的blur 当输入域失去焦点去截取10个字符或者20个字节的输入内容
但是交互感觉不太好，我可爱的同事sket发现了一个属性监听中文输入发的输入compositionstart, compositionend
当文本段落的组成完成或取消时, compositionend 事件将被激发 (具有特殊字符的激发, 需要一系列键和其他输入, 如语音识别或移动中的字词建议)。所以我用compositionend替换了blur事件去做操作，体验好了很多
相关解决办法的文章
具体的文档请点击这里
demo的案例请点击这里
上代码：
input.html
0/10
input.js
var name = $("#name")
$("#name").on('input propertychange',function(){
var codeLength = getLength($(this).val()),
length = Math.floor(codeLength/2)
$('.numberReal').html(length)
})
$("#name").on('compositionend',function(){
var codeLength= getLength($(this).val()),
length= Math.floor(codeLength/2),
newStr= '',
newCodeLength= 0
if(length>10){
//获取截取字节长度之后的字符串
var arr =$(this).val().split('')
for(var value of arr){
newCodeLength += getLength(value)
newStr+=value
if(newCodeLength >=20){
$(this).val(newStr)
$('.numberReal').html(Math.floor(getLength($(this).val())/2))
break
}
}
}
});
/**
*获取字符串的字节长度
*/
function getLength(str)
{
var realLength = 0;
for (var i = 0; i < str.length; i++)
{
charCode = str.charCodeAt(i);
if (charCode >= 0 && charCode <= 128)
realLength += 1;
else
realLength += 2;
}
return realLength;
}
android输入法状态监听 js,中文拼音输入法在input监听的问题(监听字节数)相关推荐
- Android开发-Android studio自带模拟器使用中文拼音输入法
Android开发-Android studio自带模拟器使用中文拼音输入法 搜狗输入法下载 搜狗输入法安装 修改模拟器语言 搜狗输入法下载 上篇文章中我们在Android studio中创建了X86 ...
- python输入中文教程_如何用Python从头开始实现一个中文拼音输入法？
中文输入法是一个历史悠久的问题,但也实在是个繁琐的活,不知道这是不是网上很少有人分享中文拼音输入法的原因,接着这次NLP Project的机会,我觉得实现一发中文拼音输入法,看看水有多深,结果发现还挺 ...
- 编辑python用什么输入法_用Python从0开始实现一个中文拼音输入法！
众所周知,中文输入法是一个历史悠久的问题,但也实在是个繁琐的活,不知道这是不是网上很少有人分享中文拼音输入法的原因,接着这次NLP Project的机会,我觉得实现一发中文拼音输入法,看看水有多深,结 ...
- python自定义拼音输入法_用Python从0开始实现一个中文拼音输入法
众所周知,中文输入法是一个历史悠久的问题,但也实在是个繁琐的活,不知道这是不是网上很少有人分享中文拼音输入法的原因,接着这次NLP Project的机会,我觉得实现一发中文拼音输入法,看看水有多深,结 ...
- linux系统可以显示中文输入法,2 Linux支持中文显示和中文拼音输入法（番外篇）...
今天打开虚拟机 linux 本来要整理笔记 发现Linux不支持中文.修改了/etc/sysconfig/i18n也不好使. 后来我猜想是没有装中文语言包,上网一查果然是这样. 装语言包: 1找到r ...
- Ubuntu 18.04 配置ibus中文拼音输入法
18.04系统想安装中文输入法(利用ibus输入法配置)只要三步. 注意:你的Ubuntu需要可以上网!!!因为要下载一系列安装包 第一步:首先需要给Ubuntu18.04安装Chinese语言包支持 ...
- 英文版本Ubuntu下添加中文拼音输入法: Chinese (Intelligent Pinyin)
快乐时光_03 废话不多说,直接上教程: (1)在设定中添加中文语言支持: Settings -> Region & Language -> Manage installed La ...
- 英文版ubuntu系统如何添加中文拼音输入法
英文版ubuntu系统如何添加中文拼音输入法 我使用的版本为ubuntu18.04.5 1.进入设置的region & language界面 1.点击manage install langua ...
- CentOs8安装、CentOs8中文拼音输入法安装、Nginx安装配置详解
文章目录 CentOs8安装配置 CentOs8安装中文拼音输入法 CentOs8快捷键设置 CentOs8 Nginx安装 1.安装gcc 2.pcre.pcre-devel安装 3.zlib安装 ...
最新文章
- Golang for range陷阱
- tf.keras遇见的坑：Output tensors to a Model must be the output of a TensorFlow `Layer`
- 用户数从 0 到亿，我的 K8s 踩坑血泪史
- 渣男一般的产品经理长什么样？管过几百产品之后，谈谈如何做好这一行
- 在vs2012下编译出现Msvcp120d.dll 丢失的问题
- 设计模式之二抽象工厂设计模式
- iis php的mime映射_iis MIME 映射添加.php文件映射类型肿么定义
- EFGrid ---- copy 属性
- asp.net 百度编辑器 UEditor 上传图片 图片上传配置 编辑器配置 网络连接错误，请检查配置后重试...
- Struts2之OGNL类型转换
- PTA 数据结构题集
- 最小采样频率计算公式_SPC子组样本量大小和抽样频率
- 纽约市建筑能源得分预测代码分析
- Python 实现 T00ls 自动签到脚本（邮件+钉钉通知）
- 某最新《手绘POP插画完整详解》
- 展示类页面测试Excel基础
- 【转载】Python第三方库资源
- shell 常用工具指令
- python脱离环境运行_脱离Python环境运行的问题所使用的工具介绍
- 高斯分布的随机数生成器
热门文章
- 拼多多搜索页面html,爬虫神器pyppeteer，对 js 加密降维打击
- 基于jsp,ssm校园失物招领管理平台(带论文)
- 《数据安全合规评估方法》发布
- 开旗舰店、设研发中心、启动新战略，这些消费零售巨头继续看好中国市场 | 跨国企业在中国...
- 微信小程序 movable-view组件应用：可拖动悬浮框_返回首页
- 我的第一篇博客————亲自下笔（笔触稚嫩）
- 计算机数据存储怎么转换,数据存储单位之间怎么换算 数据储存单位之间换算方法【图文】...
- paypal nvp name value paire paypal ecshop sanbox测试账号
- ADB logcat 过滤方法(抓取日志)
- RGB码流的计算：分辨率与帧率