javascript - 检测 AUI 对话框中按下的 Enter 键

Question

我想检测在加载到对话框中的 html 文本字段中是否使用了 Enter。

如果按下回车键，我想模拟单击保存按钮。

我尝试了很多东西，基本上插入了这个代码:

 $(document).keypress(function(e) {
      if (e.keyCode == $.ui.keyCode.ENTER) {
        $("#resultTextArea").val("Enter gedrueckt");
            $(this).find("button:saveBtn").trigger("click");                                                                        
      }
});

下面是 AUI 对话框(我在其中尝试了上面的代码)

          AUI().use('aui-dialog', 'liferay-portlet-url', function(A) {
                var dialog = new A.Dialog({
                                            title: 'New title',
                                            centered: true,
                                            modal: true,
                                            width: 500,
                                            height: 200,
                                            bodyContent:AUI().one('#addTestDialog'),
                                            buttons: [ 
                                                       { label : "Save" , id : "saveBtn" , handler : function(){ 
                                                            saveStuff();
                                                            this.close();
                                                        }
                                                       }
                                                        ],

                                            open: function() {
                                                $(document).keypress(function(e) {
                                                    if (e.keyCode == $.ui.keyCode.ENTER) {
                                                         $("#resultTextArea").val("Enter gedrueckt");
                                                        $(this).find("button:saveBtn").trigger("click");                                                                        
                                                    }
                                                });
                                            }

                }).render();
            });

这是定义对话框主体的 html 部分:

<div style="display:none;">
  <div id="addTestDialog">

   <portlet:actionURL name="addNote" var="addNoteURL" />
    <br>
    <table style="width:100%;">
    <tr>
        <td>Name:</td>
        <td><input id="textInput" style="width:98%;height:20px;"></input></td>
    </tr>       
    </table> 
  </div>
</div>

我检查了AlloyUI的API，发现了这个:http://deploy.alloyui.com/api/classes/Dialog.html

在属性下:我发现的每个教程/代码中都没有使用打开的内容。因此这是行不通的(至少我这么认为)。我测试了初始化，但这也不起作用。

感谢您的任何帮助/提示。

Answer 1

您可以使用jQuery来完成此任务

即

$("#saveBtn").keypress(function(event){
  var keycode = (event.keyCode ? event.keyCode : event.which);
    if (keycode == '13') {
      // do what you want
    }
});

HTH