阻止中文输入时触发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('限制最大输入字符(截取)')
    })
  })
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

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

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • php 7.2 安装 mcrypt 扩展

    php 7.2 安装 mcrypt 扩展

    2021年10月29日
  • flex垂直居中问题「建议收藏」

    flex垂直居中问题「建议收藏」.container{ display:flex; justify-content:center; aligin-items:center;}垂直居中当内容超过container,上方会超出容器设置.item{ margin:auto;}或:justify-content:safecenteralign-self:safecenter

  • 【深度学习入门】——亲手实现图像卷积操作[通俗易懂]

    【深度学习入门】——亲手实现图像卷积操作[通俗易懂]深度学习中有一个很重要的概念就是卷积神经网络CNN,卷积神经网络中又有卷积层、池化层的概念。尤其是卷积层,理解难度比较大,虽然书中或者是视频中都有详细介绍过它的基础概念,但对于求知欲望很强烈的我,我总心里痒痒的,总想亲手实现,看看效果,怕的就是自己会眼高手低,做技术人最可怕的就是眼高手低。所以,我打算用python来亲自验证一遍。什么是卷积?卷积(convolution)是数学知…

  • lamda表达式和三个例子

    lamda表达式和三个例子(参数)->{方法语句}这样的形式就是lamda表达式,不用定义参数和返回值的数据类型-可以省略的情况:只有一个参数的时候参数可以不用括号;只有一个语句的时候大括号可以不用;只有一个语句且是return的时候可以省略return,直接写需要返回的值(表达式)目录1、for循环实例2、多线程实例3、sort排序实例1、for循环实例这个实例展示了传入一个参数且无返回值的用法定义一个字符串数组并实例化,对这个数组进行操作。通常的打印所有元..

  • java的英文文献综述_java英文参考文献.doc[通俗易懂]

    java的英文文献综述_java英文参考文献.doc[通俗易懂]java英文参考文献环境风水学论文参考文献(一)摘要:中国传统人居环境文化,俗称风水,是中国人居环境的艺术。中国传统人居环境文化历经千年而不衰,归功于其坚实的理论基础和强大的现实适用性。风水作为一种东方文化特有的思维方式,不仅体现在中国城市、庙宇、乡村、道路、住宅的选址和规划布局中,而且渗透、积淀为中国人心理层面上的审美文化取向,成为中国人的基因。丁文剑《现代建筑与古代风水》上海东华大学出版社…

  • OleDbCommand OleDbDataAdapter比较研究素材

    OleDbCommand OleDbDataAdapter比较研究素材转载地址:http://blog.sina.com.cn/s/blog_43eb83b901017fy6.html致谢!——————————————————————————————————-为什么使用OleDbCommand时OleDbConn…

发表回复

您的电子邮箱地址不会被公开。

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