在文本框中按回车键时的 JQuery 执行函数

JQuery execute function when enter is pressed in a textbox

本文关键字:JQuery 执行 函数 回车 文本      更新时间:2023-09-26
        $(document).keypress(function(e) {
            if(e.which == 13) {
                $("#submitButton").click(); 
            }
        });

这就是我在页面中按 Enter 时必须执行的功能,但这与我的dropdown list键盘导航冲突。

<div class="form-group" id="contractGroup">
                <label for="inputContract" class="col-sm-5 control-label">Contract Type <b>*</b></label>
                <div class="col-sm-7">
                    <div class="input-group" id="contractPicker">
                        <div class="input-group-btn">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><span class="caret"></span></button>
                            <ul class="dropdown-menu" role="menu">
                                <li><a href="#">Full-time</a></li>
                                <li><a href="#">Part-time</a></li>
                            </ul>
                        </div>
                        <asp:TextBox runat="server" type="text" class="form-control" ID="inputContract" placeholder="Full time, Part time"></asp:TextBox>
                    </div>
                </div>
            </div>

尝试按 Tab 键浏览 dropdown list 时,您必须使用 Enter 来选择项目,这也同时执行我的函数,这是我不想要的。

我知道它可以为每个textbox执行功能,检查是否在该textbox具有焦点时按下了 Enter 键,但我有超过 20+ 个,宁愿避免这种情况。而且我知道我可以使用asp:panel defaultbutton但这忽略了我的 jquery 函数并调用代码隐藏而不是 jquery 函数,因为我有 2 个linking buttons充当一个,其中一个不能asp:button这是asp:panel所需的。

另一种解决方案是以某种方式使dropdown list区别对待,而不是作为"当前页面"。我正在使用引导datepicker,当键盘在日历弹出窗口中导航时,我可以在不调用我的函数的情况下使用 enter。如果可能的话,我希望有一个功能来检测页面上的任何textbox是否按下了 enter。干杯

尝试将

id 添加到下拉div 中,并为其绑定一个点击侦听器,以防止它冒泡。像...

$("#dropdown-list").keypress(function(e) {
            e.preventDefault();
        });