jQuery对话框无法响应键盘按键

Question

我有一个jQuery确认对话框，当用户按下Enter键时，不会触发与默认按钮关联的事件；当我使用鼠标时，按钮的行为符合预期。

当我按下Enter键时，默认按钮（“取消”）确实高亮显示，但没有其他反应。

这是对话框：

以下是生成上述对话框的代码：

$(document).ready(function () {

    $('#m_btnNext').click(function (e) {
            var my_messages = 'warning';
            if (my_messages.length > 0) {
                e.preventDefault();
                $('#dialog-confirm-withdraw').html(my_messages);
                $("#dialog-confirm-withdraw").dialog("open");
                return false;
            }
            return true;    
            });

        var cascadeConfirmWithdrawMarkup = "<div id='dialog-confirm-withdraw' title='Withdraw'><p>Set on build</p></div>";
        $(cascadeConfirmWithdrawMarkup).appendTo('body').hide();

        $('#dialog-confirm-withdraw').dialog({ title: '<span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>Withdraw Warnings',
            width: 400,
            height: 175,
            resizable: false,
            draggable: false,
            modal: true,
            autoOpen: false,
            open: function () {
                $('.ui-dialog-buttonpane button:eq(1)').focus();
            },
            buttons: {
                "Proceed with withdraw": function () {
                    $(this).dialog("close");
                },
                "Cancel": function () {
                    $(this).dialog("close");
                }
            }
        });
});

在最简单的形式下，这段代码可以正常工作，但我在我的真实表单中很难找到问题所在。

我注释掉了所有其他javascript代码，只留下上面的代码；没有错误被记录到控制台中；但什么也没有发生。

如果上述js中没有明显的错误，那么找到这个问题的最佳方法是什么？

受虐狂者可以下载完整的html页面（包括所有javascript），在这里。我使用FF的“保存为“Web Page, Complete”来创建该zip文件。

请注意，我只是在给这个表单添加功能；我并没有创建它。

- ray

---

你在文档上有绑定任何按键事件吗？ - epascarello

请放上您实际表单中的其他事件，以便我们查看。请发布整个代码。 - castillo.io

据我所知，没有。我在Stack Overflow上找到了一些关于附加KeyPress和KeyDown事件的示例这里和这里（请参见Ken Browning的答案），但是我无法使用它们获得响应。公平地说，即使在示例中，我也无法让它们正常工作，所以很可能是我漏掉了什么。 - ray

@castillo.io 发布了...但要小心...这不是给胆小的人看的。 - ray

你能同时添加HTML吗？ - castillo.io

Answer 1

在 halcyonCommon.js 中，您有一个名为 KeyListener() 的函数，在文档加载时调用。该函数添加了一个键盘按下事件监听器，并且似乎正在处理整个文档的 escape 和 enter 键按下事件：

        case KeyCode.Enter:             
            if (el.tagName == "INPUT") {                    
                switch (el.type) {
                    case "checkbox" :
                    case "password" :
                    case "radio" :
                    case "text" : 
                        {   //Check for datebox and timebox, has controller --> onblur before click OK
                            if (el.Controller && el.Controller.onblur)
                                el.Controller.onblur({target : el});

                            return oThis.clickAction(oThis._DefaultButton, e); 
                        }
                    break;                      
                    case "file" ://ThamHNguyen, added 14-NOV-06
                        return oThis.clickAction(oThis._DefaultButton, e);
                        break;

                    default:
                        return true;
                }
            } else if (el.tagName == "SELECT") {
                return oThis.clickAction(oThis._DefaultButton, e);              
            } else if (el.tagName == "HTML" || el.tagName == "BODY" || el.tagName == "TD") { //"TD" : on IE only
                return oThis.clickAction(oThis._DefaultButton, e);              
            } else if (el.tagName == "TEXTAREA" || el.tagName == "A" ) {
                return true;
            } else {
                return false; //Prevent default button of IE
            }

看到最后一个else语句了吗？删除它可以解决问题，但这可能会导致程序在其他地方出现不良行为。如果确实如此，您需要在此行中添加第三种可能的情况来返回true（从而允许正常行为）。

} else if (el.tagName == "TEXTAREA" || el.tagName == "A" )

例如：

} else if (el.tagName == "TEXTAREA" || el.tagName == "A" || el.tagName == "SPAN" )

...虽然这可能不够具体。

- Semicolon