捕获enter keyup事件，同时显示错误405：不允许的方法

Question

I'm writing a keyup event on a search input like:

$("#searchbox").keyup(function(e){
    var curKey = e.which; 
    var text = $(this).attr("value");
    if(curKey == 13){
        $(".menu_tab").removeClass("menu_bg");
        $(".mainGreyBox").css("display","none");
        $("#aboutSearchResult").css("display","block");

    }else{
        var text = $(this).attr("value");
        console.log(text);
        $("#searchresult").empty();
        var SearchMan = new SearchModel().init(text); //显示search列表
        $(".global_acResults").show();
    }

I want to show a new page which id is "aboutSearchResult" when I enter the search words and then press the enter on the keyboard.But I find that the page I want to show flash past and then the page shows like:

But I don't know why,looking for your help,thanks.

ps: #searchbox is an input element.

Answer 1

The keydown event generated when you press the Enter key in the text box is not being handled, and is causing the form that the input element is a member of to be submitted (to a URI that isn't expecting a form to be submitted to it, hence the error).

Bind your event handler to keydown , not keyup , and include

event.preventDefault();

in the branch for Enter ( curKey == 13 ) to prevent it from triggering the default behavior (of submitting the form).