5

Enter我有一个用TAB键替换的javascript脚本:

function ReplaceEnterWithTab() { if (event.keyCode == 13) event.keyCode = 9; return false; }

我这样使用它:

txt.Attributes.Add("OnKeyDown", "ReplaceEnterWithTab();");

这段代码很好用。现在我想用 jQuery 开发一个不需要添加OnKeyDown属性的脚本。请考虑这个示例页面:

<form id="form1" runat="server">
<div>
    <asp:TextBox ID="TextBox1" runat="server" CssClass="EntTab"></asp:TextBox>
    <br />
    <br />
    <asp:TextBox ID="TextBox2" runat="server" CssClass="EntTab"></asp:TextBox>
    <br />
    <br />
    <asp:DropDownList ID="DropDownList1" runat="server" CssClass="EntTab">
        <asp:ListItem>1</asp:ListItem>
        <asp:ListItem>2</asp:ListItem>
    </asp:DropDownList>
    <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
</div>
</form>

我写了这段代码:

$(document).ready(function () {

        $('.EntTab').on('keydown', function (e) {
            if (e.keyCode == 13) e.keyCode = 9;
        });

    });

问题是当我按下Enter键时TextBox1Button1导致页面回发。我该如何解决这个问题?

谢谢

4

2 回答 2

7

尝试:

$(document).ready(function () {
    $(".EntTab").bind("keypress", function(e) {

        if (e.keyCode == 13) {
            var inps = $("input, select"); //add select too
            for (var x = 0; x < inps.length; x++) {
                if (inps[x] == this) {
                    while ((inps[x]).name == (inps[x + 1]).name) {
                    x++;
                    }
                    if ((x + 1) < inps.length) $(inps[x + 1]).focus();
                }
            }   e.preventDefault();
        }
    });
});

你是不是有这样的意思。

于 2012-05-02T06:39:49.117 回答
2

您忘记取消事件传播,添加return false到 keydown 回调:

$(document).ready(function () {
    $('.EntTab').on('keydown', function (e) {
        if (e.keyCode == 13) e.keyCode = 9;
        return false;
    });
});

此外,ASP.NET 中的 Button 标记默认情况下UseSubmitBehavior 将标志设置为 true,这会导致按钮呈现为input type="submit"标记。尝试将其设置为 false,以获得类似以下答案中所述的行为:使用 Javascript 更改在输入键按下时激活哪个提交

于 2012-05-02T06:39:39.567 回答