在Jquery上按Enter键时单击事件触发器

Question

我遇到了一个大问题。在我的网站上，我使用的是搜索框。当click/enter按下搜索结果时，会重定向到特定页面。点击窗口的其他部分时，我还提供了hide()个搜索结果。问题是，当我在结果上按 Enter 键时，它会执行点击功能并删除搜索输出窗口内容。我只需要在鼠标点击时清除搜索结果。

这是我的点击事件代码

$(document).click(function (e) {
if (!$(e.target).is('#search_result')) {
        $("#search_result").hide();
    $("#search_result").html("");

    }

});

我的输入事件是

function TriggerSearch(e) {
    var search_string = $("#search").val();
    e = e || window.event;
    var keycode;
    if (window.event) {
        keycode = e.which ? window.event.which : window.event.keyCode;
    }
    var key = e.which;
    switch (key) {
    case 38:
        break;
    case 40:
        break;
    case 13:
        search_product();
    break;
    default:
        default function();
    }
}

对TriggerSearch的调用是

$("#search").keyup(TriggerSearch);

这3个部分包含工作流程。按 Enter ，而不是转到search_product()函数，它会执行click事件。它没有进入search_product()功能。据我所知，当click上发生#search事件时，它将转到TriggerSearch()函数，如果是13，则执行search_product()函数。我不明白为什么这不会发生。

如何在按 Enter 键时阻止执行点击事件？

Answer 1

preventdefault()应该可以解决问题（因为您通过TriggerSearch事件将标准事件对象传递给keyup。 更新：您必须使用keypress事件而不是keyup，因为它是触发表单提交的事件。

case 13:
        e.preventDefault();
        search_product();

如果没有，请发布其余代码：）

更新

问题是默认表单提交是在keypress上触发的，而不是keyup。我将其更改为使用keypress而现在使用preventDefault（大写D，对不起）：

JSFiddle：http://jsfiddle.net/TrueBlueAussie/qLK94/1/

function search_product() {
    alert("search_product()");
}

function TriggerSearch(e) {
    var search_string = $("#search").val();
    e = e || window.event;
    var keycode;
    if (window.event) {
        keycode = e.which ? window.event.which : window.event.keyCode;
    }
    var key = e.which;
    switch (key) {
        case 38:
            break;
        case 40:
            break;
        case 13:
            e.preventDefault();
            search_product();
            break;
        default:
            break;
    }
}
$("#search").keypress(TriggerSearch);

要测试，请在JSFiddle中注释掉e.preventDefault();，然后页面会尝试在Enter上提交。

更新（不需要提交按钮）

jsFiddle：http://jsfiddle.net/TrueBlueAussie/qLK94/2/

根据以下评论，我应该澄清，我提到的提交操作与提交按钮无关，但与表单有关。这个例子没有提交，但做了想做的事。

注意：我必须删除default function()因为它出错了。    应该做什么？

Answer 2

我的第一个建议是不使用全局点击处理程序。而是将其绑定到搜索字段$('#searchField').click()。其次，您可能希望在搜索框中使用模糊和焦点事件来触发隐藏内容。

现场演示将有助于缩小您尝试实现的目标。