(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在输入中文时,会获取拼音的问题的更多相关文章

  1. IDEA下搜狗输入法输入中文时卡着不动的参考解决方法

    在IntelliJ IDEA工具的java编辑窗口,给代码增加注释时发现,输入中文时,搜狗输入法界面不动,一直卡着,如图:  我想输入“根据”两个字,但搜狗输入法界面一直卡着不刷新,导致都不知道自己输 ...

  2. input、textarea等输入框输入中文时,拼音在输入框内会触发input事件的问题

    监听文本输入框的input事件,在拼写汉字(输入法)但汉字并未实际填充到文本框中(选词)时会触发input事件,如图: 但是在很多情况下,只需要输入到输入框的中文字符. 解决办法: 通过查阅资料得知在 ...

  3. 解决oninput事件在中文输入法下会取得拼音的值的问题

    在做搜索等功能时,很多时候我们需要实时获取用户输入的值,而常常会得到类似 w'm 这样的拼音.为了解决这个问题,我在网上搜索了下相关问题,发现了两个陌生的事件:compositionstart 和 c ...

  4. input输入中文时,拼音在输入框内会触发input事件的问题。

    问题描述: 监听文本输入框的input事件,在拼写汉字(输入法)但汉字并未实际填充到文本框中(选词)时会触发input事件,如图: 需要完成的需求就是在输入阶段不触发input中的事件,选词之后文字落 ...

  5. input在输入中文时所触发的事件(防止输入中文时重复执行)

    一般在监听文本框输入时监听文本内容改变事件,可以使用oninput和onchange事件,两者区别在于oninput在文本输入状态可以一直监听变化,onchange在文本框失去焦点时才会触发,所以要想 ...

  6. Debain下解决sublime无法输入中文

    sublime安装的方法在此不做过多介绍,网上有很多中教程的方式.本文描述在已经安装sublime的前提下如何输入中文. 1.保存下面的代码到文件sublime_imfix.c(位于~目录) #inc ...

  7. PhpStorm 2016.3 For Mac 重大里程碑更新 -- 终于解决了不能输入中文标点符号的重大bug

    PhpStorm 2016.3 For Mac 重大里程碑更新 1.[终于解决了]不能输入中文标点符号的重大bug,如 逗号“,”.“.”: 2.可以在一个窗体中,同时打开多个项目: 3.其他... ...

  8. jquery keyup 在IOS设备上输入中文时不触发

    今天做一个异步查询功能的时候发现在IOS设备上查询中文时keyup没有触发,在其他设备上时可以的,后来在stackoverflow上找到下面这种解决方法,贴出来算是抛砖引玉了. $h_input.on ...

  9. ubuntu18上解决Qt无法输入中文

    系统:Ubuntu 18.04.3 64bit 软件: QtCreator 4.8 安装Ubuntu18.04 时已经安装fcitx框架的搜狗输入法,在此不再安装fcitx及搜狗输入法 只需要安装fc ...

随机推荐

  1. 安装tftp服务器进行文件传输

    1. 安装: sudo apt-get install tftp-hpa tftpd-hpa ps: tftpd是服务器,tftp是客户端,客户端能发送和获取,服务器不能动. 2. 配置文件: sud ...

  2. C++中纯虚函数

    1.纯虚函数 virtual ReturnType Function()= 0; 纯虚函数可以让类先具有一个操作名称,而没有操作内容,让派生类在继承时再去具体地给出定义.凡是含有纯虚函数的类叫做抽象类 ...

  3. 查看sqlserver所有存储过程、视图等脚本语句

    sqlserver上右击——任务——生成脚本 下一步——选择特定数据库对象 导出即可

  4. CentOS 7安装zabbix步骤

    Zabbix配置安装 1.前期准备: 我自己的基础环境:CentOS 7 + Mysql 5.6 可以根据官网介绍一步一步安装,官网地址:https://www.zabbix.com/ 图1: 然后点 ...

  5. DNA甲基化检测服务

    DNA甲基化检测服务 DNA甲基化是最早发现的基因表观修饰方式之一,真核生物中的甲基化仅发生于胞嘧啶,即在DNA甲基化转移酶(DNMTs)的作用下使CpG二核苷酸5'-端的胞嘧啶转变为5'-甲基胞嘧啶 ...

  6. 微信分享 apicloud方式 中遇到的坎

    1  appid填错了. 2 图片地址没写对,可能因为拼写问题,图片不存在 3 图片大小有限制.不能太大.

  7. 替换SQL执行计划

    Switching two different SQL Plan with SQL Profile in Oracle... 当SQL是业务系统动态生成的,或者是第三方系统产生的,在数据库层面分析发现 ...

  8. Nginx安装SSL安全证书

    1. 在Nginx的安装目录下的config目录下创建cert目录,并且将下载的证书全部文件拷贝到cert目录中.如果申请证书时是自己创建的CSR文件,请将对应的私钥文件放到cert目录下并且命名为2 ...

  9. (连通图 模板题 无向图求割点)Network --UVA--315(POJ--1144)

    链接: https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...

  10. CreateDialog()与CreateDialogIndrect()

    CreateDialog() 概述 函数功能:CreateDialog宏从一个对话框模板资源创建一个无模式的对话框,CreateDiaog宏使用CreateDialogParam函数. 函数原型:HW ...