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

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

如何防止在按 Enter 键时执行单击事件？

Answer 1

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

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

如果没有，请发布其余代码:)

更新:

问题是默认的表单提交是在按键时触发的，而不是在按键时触发的。我将其更改为使用 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()，因为它给出了错误。 那应该做什么？