解决oninput在输入中文时,会获取拼音的问题
(1)起因:在今天做项目测试的时候发现的问题,在用微软自带的输入法的时候,输入中文,文本框会获得拼音
如图所示:
(2)解决办法:经过一段时间的百度查找,最后通过这篇文章找到了解决的方法,这里给出网址:https://segmentfault.com/a/1190000012490380
为文本框添加compositionstart和compositionend方法,这样在使用微软自带输入法时,在进行input验证的时候,就不会验证拼音了,而是等中文输入完成后再进行验证
- compositionstart:在输入中文或者语音等需要等待一连串的输入的操作之前,compositionstart事件会触发
- compositionend:在输入中文或语音等完毕或取消时,compositionend事件会触发
(3)对应代码
//valDom:对应的文本框的id
function Input_ValidateNum(valDom) {
var isInputZh = false;
var search = document.getElementById(valDom);
search.addEventListener('compositionstart', function (e) {
isInputZh = true;
}, false);
search.addEventListener('compositionend', function (e) {
isInputZh = false;
ValidateNum(valDom); //这个方法可以随意更换,是用来处理输入数据的
}, false);
search.addEventListener('input', function (e) {
if (isInputZh) return;
ValidateNum(valDom);//这个方法可以随意更换,是用来处理输入数据的
}, false); } 处理方法对应的代码:
//验证输入的是否是数字或英文
//valDom:要进行验证的文本框
function ValidateNum(valDom) {
var domVal = $("#" + valDom + "").val();
$("#" + valDom + "").val(domVal.replace(/[\W]/g, ''));
}
(4)在网页中的调用
控件的定义:
<input id="Title" type="text">
在页面的初始方法中,调用上面的方法
$(function () {
Input_ValidateCEN('Title');
});
根据上面的步骤,完成之后,在输入的时候就可以对文本框的内容进行限制,对于微软输入法输入中文获取拼音的问题也就解决了,在这里再次感谢https://segmentfault.com/a/1190000012490380这个网址对应的方法,
参考https://segmentfault.com/a/1190000012490380这个网址
此文档用于平时的积累,如果有问题,请留言,不胜感激,谢谢
解决oninput在输入中文时,会获取拼音的问题的更多相关文章
- IDEA下搜狗输入法输入中文时卡着不动的参考解决方法
在IntelliJ IDEA工具的java编辑窗口,给代码增加注释时发现,输入中文时,搜狗输入法界面不动,一直卡着,如图: 我想输入“根据”两个字,但搜狗输入法界面一直卡着不刷新,导致都不知道自己输 ...
- input、textarea等输入框输入中文时,拼音在输入框内会触发input事件的问题
监听文本输入框的input事件,在拼写汉字(输入法)但汉字并未实际填充到文本框中(选词)时会触发input事件,如图: 但是在很多情况下,只需要输入到输入框的中文字符. 解决办法: 通过查阅资料得知在 ...
- 解决oninput事件在中文输入法下会取得拼音的值的问题
在做搜索等功能时,很多时候我们需要实时获取用户输入的值,而常常会得到类似 w'm 这样的拼音.为了解决这个问题,我在网上搜索了下相关问题,发现了两个陌生的事件:compositionstart 和 c ...
- input输入中文时,拼音在输入框内会触发input事件的问题。
问题描述: 监听文本输入框的input事件,在拼写汉字(输入法)但汉字并未实际填充到文本框中(选词)时会触发input事件,如图: 需要完成的需求就是在输入阶段不触发input中的事件,选词之后文字落 ...
- input在输入中文时所触发的事件(防止输入中文时重复执行)
一般在监听文本框输入时监听文本内容改变事件,可以使用oninput和onchange事件,两者区别在于oninput在文本输入状态可以一直监听变化,onchange在文本框失去焦点时才会触发,所以要想 ...
- Debain下解决sublime无法输入中文
sublime安装的方法在此不做过多介绍,网上有很多中教程的方式.本文描述在已经安装sublime的前提下如何输入中文. 1.保存下面的代码到文件sublime_imfix.c(位于~目录) #inc ...
- PhpStorm 2016.3 For Mac 重大里程碑更新 -- 终于解决了不能输入中文标点符号的重大bug
PhpStorm 2016.3 For Mac 重大里程碑更新 1.[终于解决了]不能输入中文标点符号的重大bug,如 逗号“,”.“.”: 2.可以在一个窗体中,同时打开多个项目: 3.其他... ...
- jquery keyup 在IOS设备上输入中文时不触发
今天做一个异步查询功能的时候发现在IOS设备上查询中文时keyup没有触发,在其他设备上时可以的,后来在stackoverflow上找到下面这种解决方法,贴出来算是抛砖引玉了. $h_input.on ...
- ubuntu18上解决Qt无法输入中文
系统:Ubuntu 18.04.3 64bit 软件: QtCreator 4.8 安装Ubuntu18.04 时已经安装fcitx框架的搜狗输入法,在此不再安装fcitx及搜狗输入法 只需要安装fc ...
随机推荐
- TZOJ 1840 Jack Straws(线段相交+并查集)
描述 In the game of Jack Straws, a number of plastic or wooden "straws" are dumped on the ta ...
- 基于Python Shell获取hostname和fqdn释疑
一直以来被Linux的hostname和fqdn(Fully Qualified Domain Name)困惑了好久,今天专门抽时间把它们的使用细节弄清了. 一.设置hostname/fqdn 在Li ...
- 【校招面试 之 C/C++】第6题 C++深拷贝与浅拷贝
1.两个的区别(1)在未定义显示拷贝构造函数的情况下,系统会调用默认的拷贝函数——即浅拷贝,它能够完成成员的一一复制.当数据成员中没有指针时,浅拷贝是可行的: 但当数据成员中有指针时,如果采用简单的浅 ...
- HttpClient实战二:单线程和多线程连接池实例
为什么使用HTTP连接池? 随着系统架构风格逐渐向前后端分离架构,微服务架构转变,RestFul风格API的开发与设计,同时SpringMVC也很好的支持了REST风格接口.各个系统之间服务的调用大多 ...
- Docker常见问题
问题 当我使用docke search mysql时,显示如下错误: [root@iZ25u61v97hZ opt]# docker search redis Segmentation Fault o ...
- mysql自定义函数收集
代码: 查找字符串 in_string 中,存在多少个字符串 in_find_str delimiter $$ DROP FUNCTION IF EXISTS `fn_findCharCount` $ ...
- Halcon的一维条码解码步骤和解码技巧
一.图像预处理和条码增强 对比度太低:scale_image(或使用外部程序scale_image_range),增强图像的对比度. 图像模糊:emphasize锐化图像,使条码看起来更清晰. 深色背 ...
- Linux objdump命令
一.简介 objdump命令是用查看目标文件或者可执行的目标文件的构成的gcc工具. 二.选项 http://my.oschina.net/alphajay/blog/7729 http://man. ...
- 201621123008 《Java程序设计》第五周学习总结
1. 本周学习总结 1.1 写出你认为本周学习中比较重要的知识点关键词 关键词:接口,内部类. 1.2 尝试使用思维导图将这些关键词组织起来.注:思维导图一般不需要出现过多的字. 1.3 可选:使用常 ...
- html5移动开发。
禁止滚动 $('#idl').bind("touchmove",function(e){ e.preventDefault(); }); 图片居中 (因为图片比较特别,所以需要在外 ...