1

下面的代码非常简单。我有一个 jQuery自动完成绑定到 .html 引用的 html 文本输入#search。当用户在其中输入内容时,一个下拉列表会显示来自服务器的建议。如果用户单击其中一个建议,或者在选中它的情况下按 Enter,则会出现一个弹出窗口(Facebox),显示弹出窗口中的调用页面。相反,如果用户只想执行普通搜索而不选择建议,他可以通过按 Enter 或单击 来执行此操作#searchButton。换句话说:

  1. 用户输入一些东西,例如葡萄柚
  2. 出现可选择的建议。
  3. 场景 1:用户使用鼠标或键盘选择一个建议,按 Enter 键或单击它 - 导致该项目弹出,即自动完成的结果 .handler 触发(而不是 .keypress)
  4. 场景 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();
            }
        }
    }
4

2 回答 2

3

您是否尝试过仅在搜索框上取消绑定按键事件并重新绑定您自己的按键处理程序?

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 });
});

jQuery("#search").unbind("keypress").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();
});

也可能是在自动完成处理程序中处理了其他关键事件。我认为您希望将它们从文本输入中删除,同时将它们留在自动完成“列表”中。如果自动完成处理的事件与按键不同,您可能希望删除它们。

于 2009-05-17T22:39:16.230 回答
-1

在 javascript 中,您可以简单地:

return false;

在您的事件处理函数上,以阻止事件进一步冒泡。

于 2009-05-17T22:38:17.623 回答