下面的代码非常简单。我有一个 jQuery自动完成绑定到 .html 引用的 html 文本输入#search
。当用户在其中输入内容时,一个下拉列表会显示来自服务器的建议。如果用户单击其中一个建议,或者在选中它的情况下按 Enter,则会出现一个弹出窗口(Facebox),显示弹出窗口中的调用页面。相反,如果用户只想执行普通搜索而不选择建议,他可以通过按 Enter 或单击 来执行此操作#searchButton
。换句话说:
- 用户输入一些东西,例如葡萄柚
- 出现可选择的建议。
- 场景 1:用户使用鼠标或键盘选择一个建议,按 Enter 键或单击它 - 导致该项目弹出,即自动完成的结果 .handler 触发(而不是 .keypress)
- 场景 2:用户对建议不感兴趣,而是按 Enter 或单击
#searchButton
以对他输入的内容执行完整搜索#search
。自动完成的结果处理程序不会触发,相反,Enter 按键触发#searchButton
点击事件,或者直接触发(即实际点击)从而触发正常搜索。
这在 IE6、IE7、IE8、Chrome、Safari 中运行良好,但在 Firefox 中却不行。
在 Firefox 中,当在建议上按下 Enter 时,结果处理程序和按键事件都会触发,为用户提供 facebox 弹出窗口,并执行完整搜索。我认为以某种方式停止.keypress
射击 if 。result
火灾可以解决问题,但是,我一直无法弄清楚如何做到这一点。我尝试使用 jQuerystopPropogation()
和stopImmediatePropogation()
.result 处理程序,希望它能阻止 .keypress 触发,但它并没有改变任何事情。
如果有人有任何想法,或者想帮助我解决这个问题,我将不胜感激。
提前致谢!
jQuery("#search").autocomplete("/index/suggest", {
selectFirst: false,
formatItem: function(data, i, n, value) {
return "<font color='#3399CC'>" + value.split("::")[0] + "</font>";
},
formatResult: function(data,value) {
return value.split("::")[0];
}
}).result(function(event, data, formatted) {
alert('Hello, someone selected a suggestion by clicking on it or pressing enter on it, so you\'re getting this!');
var pieces = formatted.split("::");
var url = '/' + pieces[1] + '/detail/?id=' + pieces[2];
jQuery.facebox({ ajax: url });
}).keypress(keypressHandler).blur(function() {
alert('I don\'t want this to appear if .result above is called, and it doesnt, except in firefox! Bah!');
jQuery(this).flushCache();
});
function keypressHandler(e)
{
if(e.which == 13) {
if(!jQuery('#searchButton').is(':disabled')) {
jQuery(this).blur();
jQuery('#searchButton').focus().click();
}
}
}