javascript - 定义按 Enter 键时的默认按钮

Question

我有一个 Grails 应用程序，其中包含 .gsp页面编号为textField s，几个submitToRemote按钮和几个actionSubmit其上的按钮。填写textField时s，我希望能够在完成后按 Enter 键，并使其执行与单击特定 submitToRemote 相同的操作按钮。目前，它的表现就好像我单击了特定的 actionSubmit我从未故意指定的按钮。

我发现了这个:How to trigger HTML button when you press Enter in textbox? 。这似乎是我想要的，所以我将其调整到我的页面，但它似乎没有做任何事情。

我将放弃发布整个 .gsp但添加我认为适合该问题的内容。

这是当前正在激活的按钮:

<br>
    <g:hiddenField name="type" value="head"/>
    <g:actionSubmit value="Get Reports" action="showReports"/>
<br>

这是我想要激活的按钮:

<g:submitToRemote value="find" url="[action: 'findCustomer']"
update="results" />

所以我所做的就是向目标 submitToRemote 添加一个 id按钮，和 1 textField ，然后添加 <g:javascript>标签环绕上面链接页面的脚本。看起来像这样:

<g:textField name="lastName" id="inputTextBox"/>

...

<g:submitToRemote value="find" id="findCustomer" url="[action: 'findCustomer']"
update="results" />

...

<g:javascript>
 $(document).ready(function(){
   $('#inputTextBox').keypress(function(e){
     if(e.keyCode==13)
     $('#findCustomer').click();
  });
});
</g:javascript>

此外，我正在使用 jQuery 库:

<g:javascript library="jquery" />

我不确定我的方法是否有缺陷，因为我确实需要它适用于 10 textField 中的任何一个页面上有 s。我浏览了 grails 文档，但找不到任何与此真正匹配的内容...

Answer 1

我发现该解决方案与我的解决方案非常接近。

首先，我必须向我的 submitToRemote 按钮添加一个 ID:

<g:submitToRemote value="find" url="[action: 'findCustomer']" update="results" id="submitForm"/>

然后在我的 main.gsp 中添加了正确的脚本:

$(document).bind("keypress", function (e) {
            if (e.keyCode == 13) {
                $("#submitForm").click();
                return false;
            }
        });

这里真正重要的是return false;，因为没有它，它将单击按钮，然后提交不是我需要的表单。