现在的位置: 首页 > 综合 > 正文

类似百度输入框自动联想功能遇到的问题:Opera浏览器不支持拼音输入法时的keyup事件

2018年01月17日 ⁄ 综合 ⁄ 共 1069字 ⁄ 字号 评论关闭

这个问题也许很多人都遇到过了,在百度能搜到很多遇到相同问题的人,但解决办法都是一个(下面是载自其他网页):

问题ZcT345站长站

在开启输入法的情况下,三个浏览器的具体问题如下:ZcT345站长站

  • IE:触发keydown和keyup, 不触发keypress. 能够获得输入值。
  • Firefox:触发keydown和keypress, 不触发keyup. 输入值未能获得。在回车后会触发keyup, 可获得输入值。
  • Opera:keydown, keypress和keyup都不触发,输入值也未能获。

(如果您能帮我试用一下Safari,我会很高兴并谢谢您。这里有一个 测试页面ZcT345站长站

解决方案ZcT345站长站

总结出以上问题,没有兴奋反而陷入绝望,因为没有google出解决方案(是的,对于拉丁语系的老外来说,不会存在输入法)。但是,wait, 谷歌搜索的自动补全不是工作得好好的吗?于是研究一下这个 http://www.google.cn/ac.js。嘿嘿,虽然混淆得还可以,但还是可以发现蛛丝马脚的。它使用一个计时器,当输入框处于聚焦(focus)状态时,每10秒执行一次回调函数。ZcT345站长站

虽然挺耗资源(所以建议在输入框失焦(blur)时,一定要清除这个计时器),但也只能如此了。作前端开发的,不仅要与语言(JavaScript, CSS, HTML) 斗,还要与浏览器斗,其乐无穷也。ZcT345站长站

本不想用该解决方法,但又想不到也找不到其他的解决办法,所以。。。。

下面是我项目中完成这功能的部分代码:

var intervalProcess = null;
function listenTxtVal(){
 /*由于Opera等浏览器不支持拼音输入法下的keyup等事件,所以采用keyup事件来完成autocomplete功能有问题
       所以采用setInterval来实现autocomplete*/
 intervalProcess = setInterval(ajax_request_autoComplete, 10);
}
function removeTxtListen(){
 clearInterval(intervalProcess);
}

//保存上一次文本框的值
var preTxtVal = "";

//因为每隔10毫秒调一次,比较耗性能,所以保存上一次文本值,如果文本框的值没有发生改变,则不执行if中的代码
if ($searchInput.val() != preTxtVal) {

    .........................

}

抱歉!评论已关闭.