javascript - 扳机在文本输入中按 Enter 键时

Question

我正在制作一个搜索栏，其中文本栏作为标签，搜索按钮作为 ，我使用 a 而不是的原因是因为我在按钮上使用放大镜图片，当我使用它不想正确定位自己。

这是我的 HTML：

<form id="search-form" href="#test1" class="smoothscroll">
            <input type="text" id="searchText" onClick="this.select();" placeholder="Search..."/>
            <button type="button" id="searchButton">
                <img src="magnify.png" id="magnify"/>
            </button>
        </form>

这是jQuery：

$(document).ready(function () {
    $("#searchButton").click(function () {
        var text = document.getElementById('searchText').value;
        $("html, body").animate({
            scrollTop: ($('#' + text).offset().top)
        }, 2000);
    });

    $("#searchText").keyup(function (event) {
        if (event.keyCode == 13) {
            $("#searchButton").click();
        }
    });
}); 

感谢您的帮助。

Answer 1

根据文档，您应该使用.which而不是 keyCode：

$("#searchText").keyup(function(event){
    if(event.which == 13){
        $("#searchButton").click();
    }
    // Make sure the form isn't submitted
    event.preventDefault();
});

要确定按下了哪个键，请检查传递给处理函数的事件对象。虽然浏览器使用不同的属性来存储这些信息，但 jQuery 对 .which 属性进行了规范化，因此您可以可靠地使用它来检索关键代码。

Answer 2

尝试这个

$("#searchText").keyup(function (event) {
    var code= event.keyCode ? event.keyCode : event.which;
    // or use simply, var code= event.keyCode || event.which;
    if (code == 13) {
        $("#searchButton").click();
    }
});

演示

Answer 3

$("#searchText").keyup(function(event){

  if (event.which === 13) {
    $("#searchButton").trigger("click");
   }  
});

另请参阅Javascript .keyCode 与 .which？