输入关键事件处理

时间:2013-07-19 19:53:04

标签: jquery html asp.net event-handling

-----新Jquery回答评论-----

function search2() {
    var urlString = 'Controls/LookUp.aspx?zipcode=' + $('#MultiSearch2').val();

    window.location = urlString;
    return false;
}

jQuery('#MultiSearch2').bind("keypress", function (e) {

    if (e.keyCode == 13) {
        e.preventDefault();
        search2();
    }
});

好的,这就是一切都是如何设置的。

我有一个main.master页面,其中包含以下代码。

<asp:Panel ID="PanelMainMaster" runat="server" DefaultButton="searchBTN">
    <div id="HomeQuickSearch">
        <input id="multiSearchStyle" type="text" placeholder ="search our store" />
        <asp:Button OnClientClick="return searchZone()" runat="server" Text="Go" ID="searchBTN" />     
    </div>
</asp:Panel>

我有另一个母版页(树),其中包含以下代码:

<asp:Panel ID="Panel2" runat="server" DefaultButton="submit">
    <form name="ZipCodeForm" action="/Search.cfm" method="get">
        <div style="margin-bottom: .25em">Search for a tree:</div>
        <input type="text" name="MultiSearch" id="MultiSearch" size="15" maxlength="50" style="margin-bottom: .25em">
        <asp:Button Text="Search" runat="server" ID="submit" OnClientClick="return search()" />
    </form>
</asp:Panel>

然后,有一个通过第三方创建的自定义内容页面,该页面显示在第二个母版页中,并带有以下代码:

<div id="TreeStyle">
    <Z:CustomMessage ID="Tree1" MessageKey="TreeHero" runat="server" />
</div>

从自定义消息呈现的HTML:

<input id="MultiSearch2" type="text" name="MultiSearch2" maxlength="50">
<button id="submit2" name="submit2" type="submit">Search</button>

页面按以下流程呈现:

  1. Main.Master
  2. Tree.Master
  3. Tree.Master中的自定义消息
  4. 前两个输入文本框使用DefaultButton上的asp:Panel选项处理Enter按钮事件。但是,由于Tree.Master中的自定义消息并且其中不能包含ASP,只有HTML,因此会创建第三个文本框和搜索按钮。

    我的问题是,如何处理此Enter按键事件并使用第三个文本框中的值而不是第一个文本框中的值进行搜索。

    我试过这个,但它没有用。虽然没有太多惊喜。

    function search2() {
        var urlString = 'Controls/LookUp.aspx?zipcode=' + $('#MultiSearch2').val();
    
        window.location = urlString;
        return false;
    }
    
    jQuery('#MultiSearch2').on("keypress", function (e) {
        if (e.keyCode == 13) {
            search2();
        }
    });
    

    我也遇到了一个我之前没有注意到的jquery错误:object [object Object] has no method 'on'

2 个答案:

答案 0 :(得分:7)

你可以这样做:

jQuery('#MultiSearch2').on("keypress", function (e) {            

    if (e.keyCode == 13) {

        // Cancel the default action on keypress event
        e.preventDefault(); 

        search2();
    }
});

答案 1 :(得分:2)

-----新Jquery回答评论-----

function search2() {
    var urlString = 'Controls/LookUp.aspx?zipcode=' + $('#MultiSearch2').val();

    window.location = urlString;
    return false;
}

jQuery('#MultiSearch2').bind("keypress", function (e) {

    if (e.keyCode == 13) {
        e.preventDefault();
        search2();
    }
});