HTML input输入框在输入汉字时,拼音也会输入的问题

问题:
该输入框仅可输入汉字、字母、数字
原方案:
<input id=“inputId” onkeyup=" this.value=this.value.replace('/[^\u4e00-u9fa5\da-zA-Z]/g', '') "/>
异常:
在输入中文时,对应的拼音也会填写到输入框中
分析:
中文状态下字母的输入也触发keyup事件,导致input输入框的值发生了改变
解决方案:
在中文输入时,input的输入框会触发compositionstart事件,选词结束后,触发compositionend事件。因此,忽略两个事件中间的输入即可。

//设置flag值来控制是否触发输入的过滤
var inputFlag = true;  
$("#inputId").on('compositionstart', function(){
	inputFlag = false;
});
$("#inputId").on('compositionend', function(){
	inputFlag = true;
});
$("#inputId").on('input', function(){
	if(inputFlag){
		var text = $("#inputId").val();
		text = text.replace('/[^\u4e00-u9fa5\da-zA-Z]/g', '');
		$("#inputId").val(text);
	}
});

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 6
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值