阻止中文输入时触发input事件

阻止中文输入时触发input事件做限制输入框可输入最大的长度和实时匹配输入框数据时遇到了坑——当中文输入时input事件也会被触发,即假设限制的是2个字符,你要输入社会人的“社(she)”,就会直接被截取,输入框填充文本sh。或者是在中文输入法时也会一直去调接口,匹配数据,影响了页面的性能!代码如下:$(document).on(‘input’,’input’,function(){console.log(‘限制…

大家好,又见面了,我是你们的朋友全栈君。

做限制输入框可输入最大的长度和实时匹配输入框数据时遇到了坑 —— 当中文输入时input事件也会被触发,即假设限制的是2个字符,你要输入社会人的“社(she)”,就会直接被截取,输入框填充文本sh。或者是在中文输入法时也会一直去调接口,匹配数据,影响了页面的性能!代码如下:

$(document).on('input','input',function(){ 
   
  console.log('限制最大输入字符(截取)')
})

这个问题,可以声明一个inputFlag,使用compositionstart,compositionend配合解决,代码如下:

var inputFlag = true
$(document).on('compositionstart', 'input',function () { 
   
  inputFlag = true
}).on('compositionend','input',function () { 
   
  inputFlag = false
}).on('input','input', function () { 
   
  //定时器内才会生效 注意:定时器内this指向已发生改变
  setTimeout(function(){ 
   
    if (inputFlag == false) return   // 中文输入过程中不截断
      console.log('限制最大输入字符(截取)')
    })
  })
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/141895.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • ‘android.support.v4.content‘ that cannot be safely rewritten. for androidx

    ‘android.support.v4.content‘ that cannot be safely rewritten. for androidx

    2021年10月2日
    148
  • ethtool 命令详解[通俗易懂]

    ethtool 命令详解[通俗易懂]命令描述:ethtool是用于查询及设置网卡参数的命令。使用概要:ethtoolethx      //查询ethx网口基本设置,其中x是对应网卡的编号,如eth0、eth1等等ethtool–h       //显示ethtool的命令帮助(help)ethtool–iethX   //查询ethX网口的相关信息 ethtool–dethX   //查询…

    2022年10月23日
    0
  • phpstorm2022 激活码[最新免费获取]

    (phpstorm2022 激活码)2021最新分享一个能用的的激活码出来,希望能帮到需要激活的朋友。目前这个是能用的,但是用的人多了之后也会失效,会不定时更新的,大家持续关注此网站~https://javaforall.net/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~0V…

    2022年3月31日
    795
  • Android + Appium 自动化测试完整的环境配置及代码详解

    Android + Appium 自动化测试完整的环境配置及代码详解环境的的搭建参考大神博客:https://www.cnblogs.com/fnng/p/4540731.html该博客有一套详细的入门教程,奈何时间有点久远有些东西不能用了,但是参考价值还是有滴。1.安装各种SDKjre必须1.8以上AndroidSDK需要8.0以下的测试,8.0我测试还不行,环境变量如下图所示…

    2022年7月18日
    12
  • linux解压zip文件,

    linux解压zip文件,一,linux解压zip文件,命令:unzip如果没有该命令,可先安装,命令为:yum-yinstallunzip

    2022年5月24日
    31
  • 沃舍尔算法求传递闭包_离散数学传递闭包

    沃舍尔算法求传递闭包_离散数学传递闭包给定 n 个变量和 m 个不等式。其中 n 小于等于 26,变量分别用前 n 的大写英文字母表示。不等式之间具有传递性,即若 A>B 且 B>C,则 A>C。请从前往后遍历每对关系,每次遍历时判断:如果能够确定全部关系且无矛盾,则结束循环,输出确定的次序;如果发生矛盾,则结束循环,输出有矛盾;如果循环结束时没有发生上述两种情况,则输出无定解。输入格式输入包含多组测试数据。每组测试数据,第一行包含两个整数 n 和 m。接下来 m 行,每行包含一个不等式,不等式全部为小于关系

    2022年8月10日
    12

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号