您的位置:首页 > 移动开发

移动端、手机网站中文输入法下keyup事件部分按键无效

2016-03-10 11:42 489 查看
文章来源: http://www.itnose.net/detail/6132370.html

微信公众平台开发时,客户提需求“输入框中输入内容时,输入框后边显示清除按钮,清除输入框中的内容”,使用“keyup”事件时在中文输入法下部分按键keyup事件无效, 以下为解决方案。

绑定“input”和“propertychange”事件可以解决,以下为代码:

var bind_name="input";//定义所要绑定的事件名称
if(navigator.userAgent.indexOf("MSIE")!=-1) bind_name="propertychange";//判断是否为IE内核 IE内核的事件名称要改为propertychange
/*输入框键盘离开事件绑定*/
$("input").bind(bind_name,function(){
if(this.value!=null&&this.value!=""){
var inputWidth=$(this).outerWidth();
var inputHeight=$(this).outerHeight();
var inputOffset =  $(this).offset();
var inputTop=inputOffset.top;
var inputLeft=inputOffset.left;
$("#clearDiv").css({top:inputTop+2,left:inputLeft+inputWidth-27}).show();
inputObj=this
}else{
$("#clearDiv").hide();
}
});


另外网上还有另一种解决方案,具体思路为给输入框注册focus事件,隔段时间去检索下,我个人还是比较倾向于上面那种方法的,以下为第二种方案代码:

<script language="javascript" type="text/javascript" src="jquery.js"></script>
<script>

$(function () {
$('#wd').bind('focus',filter_time);
})

var str = '';
var now = ''
filter_time = function(){
var time = setInterval(filter_staff_from_exist, 100);
$(this).bind('blur',function(){
clearInterval(time);
});
};

filter_staff_from_exist = function(){
now = $.trim($('#wd').val());
if (now != '' && now != str) {
console.log(now);
}
str = now;
}
</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: