如何使用 enter 将光标移动到下一个文本框而不是提交？答案

【问题标题】：How to use enter to move cursor to next textbox instead of submit?如何使用 enter 将光标移动到下一个文本框而不是提交？
【发布时间】：2016-05-24 17:03:01
【问题描述】：

screenshot 我试图通过按Enter 将光标移动到下一个文本框。

这是我的 aspx 代码：

<strong>
                    <asp:Label ID="bondtapelbl" runat="server" Text="Bond Tape :" Font-Bold="True" Font-Italic="False" Font-Names="Arial Black" Font-Size="Medium"></asp:Label>
                </strong>
                <asp:TextBox ID="bondtape" runat="server" BackColor="#CCCCCC" Height="35px" Font-Size="Medium" Width="130px" CssClass="bt" />

                &nbsp;<span class="auto-style6">&amp;</span><strong>
                    <asp:Label ID="productranklbl" runat="server" Text="Product Rank :" Font-Bold="True" Font-Italic="False" Font-Names="Arial Black" Font-Size="Medium"></asp:Label>

                    <asp:TextBox ID="productrank" runat="server" BackColor="#CCCCCC" Height="35px" Font-Size="Medium" Width="130px" CssClass="pr" />

                    <asp:Button ID="bontapeButton" Text="Search" runat="server" BackColor="#3399FF" BorderStyle="None" CssClass="btsearch" ForeColor="White" Height="39px" Width="80px" />
                </strong></td>

我为此使用了 javascript。问题是它没有将光标移动到下一个文本框，而是自动执行搜索按钮。

   <script type="text/javascript">

                //Bind keyup event to textbox
                $('btsearch[type="bondtape"]').keyup(function (event) {
                    if (e.keyCode == 13) {
                        $("pr").next().focus();
                    }
                });

            </script>

我的 javascript 是基于我从其他论坛获得的这个答案：

$('input[type="textbox"]').keyup(function(e) {
if(e.keyCode == 13) {
    $(this).next().focus();
}});

我只学了 2/3 天的 javascript，所以我真的不知道我错在哪一部分。如果有人可以帮助我，我将不胜感激。提前致谢。

【问题讨论】：

为什么要这样做？ Tab 键已经免费执行此操作，这正是用户所期望的。
感谢@nnnnnn 的回复。这实际上是我实习项目的一部分。我正在使用这种方法，因为这是以前的程序员对代码所做的，我只是想避免对代码进行过多的修改。请问..这种方法是错误的还是tab键方法应该是更好的方法？
嗯，tab键移动到下一个字段的概念是几乎所有桌面浏览器默认实现的。并且 shift+tab 移动到上一个字段。（大多数桌面应用程序也会对此进行一些变体。）这是用户期望的标准行为，因此实际上不需要对 Enter 键应用相同的内容。
好的，谢谢，但我正在使用扫描仪来处理这个特定的输入，而不是输入它。所以我担心使用 tab 键方法可能不适合它（因为我的主管是这么说的) 或者是吗？ @nnnnnn
当然，如果您有这样的特殊情况，那么只需做任何对用户来说最容易的事情。关于您的实际问题，您可能需要在您的 keyup 处理程序中添加e.preventDefault()。而且您可能需要使用键 down 处理程序而不是键 up （不确定）。您需要在相关元素之后包含您的脚本，和/或将您的代码放入 $(document).ready() 处理程序中。

标签： javascript asp.net vb.net

【解决方案1】：

好的，我只想分享我得到的答案。这是我得到答案的链接（您也可以尝试演示）：http://www.latentmotion.com/downloads/enter-to-tab.html
以下是适用于我的项目的 javascript。我得到的解决方案是我用下面的 javascript 替换了我在问题上的 javascript。我希望这可以帮助其他人。

 $(document).ready(function(){
        $("input").not( $(":button") ).keypress(function (evt) {
            if (evt.keyCode == 13) {
                iname = $(this).val();
                if (iname !== 'Submit'){    
                    var fields = $(this).parents('form:eq(0),body').find('button,input,textarea,select');
                    var index = fields.index( this );
                    if ( index > -1 && ( index + 1 ) < fields.length ) {
                        fields.eq( index + 1 ).focus();
                    }
                    return false;
                }
            }
        });
    });

【讨论】：