Question

我的代码：

文本框字段：

   <input id="LastName" type="text" filtercolumn="LastName" class="filterCtrl" style="width:135px; height:15px"/>

想要在上面的文本框中按Enter键时触发以下按钮：

<input type="button" class="button w100" onclick="javascript:btnAdvanceSearchClick();" value="Search" />

单击按钮时ajax请求网格的Javascript函数：

function btnAdvanceSearchClick() {
        _loadData = true;
        var $grid = $('#AdvanceSearchGrid').data('tGrid'); 
        $grid.ajaxRequest();
        $('div#divSearchGrid').show();
}

我的搜索ActionControl方法是从以下代码中调用的：

  @(Html.Telerik().Grid<Web.Mvc.Models.Search.SearchModel>()
    .Name("AdvanceSearchGrid")
    .DataBinding(db => db.Ajax()
        .Select("SearchUserByFilter", "Search", new { _loadData, _filter }).Enabled(true)
                )

当用户在文本框中单击enterkey时，如何点击按钮。请帮忙。感谢

Answer 1

这是我写的基于你想要实现的目标的简单标记

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
    <input id="LastName" type="text" />
    <input id="searchButton" type="button" onclick="javascript: btnAdvanceSearchClick();" value="Search" />

    <script>
        $(document).ready(function () {
            $("#LastName").keypress(function (event) {
                if (event.which == 13) {
                    $("#searchButton").click();
                }
            });
        });

        function btnAdvanceSearchClick() {
            alert("search invoked. Query : " + $("#LastName").val());
        }
    </script>
</body>
</html>

我将一个按键事件附加到文本框。当按键事件发生时 - 我检查是否按下Enter键。如果是，我只需按下按钮上的click（）方法。

希望这能解决你的问题。

Answer 2

您可以将函数绑定到onkeyup或onkeydown事件，并检查按下的最后一个键是否为输入（换行符）。如果是，则执行按钮单击。

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript">
        function triggerButton() {
            var input = $("#LastName");
            var lastKey = input.val().substr(input.val().length-1);
            if (lastKey == '\n') {
                 $("#mybutton").click();
            }
        }

        function onClick() {
            $("#p1").html('the button was clicked!');
        };
    </script>
</head>
<body>
    <textarea id="LastName" type="text" filtercolumn="LastName" onkeyup="triggerButton()" class="filterCtrl" style="width:135px; height:15px"></textarea>
    <button id='mybutton' onclick='onClick()'>Button</button>
    <p id='p1'></p>
</body>

如何通过按cshtml页面中输入文本框上的Enter键来触发按钮

2 个答案: