如果在 JQuery 模式对话框上单击转义键，如何将用户发送到主页

Question

在模态对话框上按下转义键时，有没有办法跳转到网页主页？下面是我正在使用的模态对话框：

        <script>

            $(function () {

                $("#dialog-login-message").dialog({

                    modal: true,

                    buttons: {

                        Ok: function () {

                            document.location.href = "/";

                            $(this).dialog("close");

                        }

                    }

                });

            });

        </script>

        <div id="dialog-login-message" title="Login Required">

            <p>

                <span class="ui-icon ui-icon-circle-check" style="float:left; margin:0 7px 50px 0;"></span>

                You are not logged into this website. You need to be logged into this website to use the demo.;

            </p>

        </div>

如果用户未通过身份验证，则会出现此对话框。如果他们按 OK，它会将他们带到主页。但是，如果他们按下退出键，对话框将通过并且视图继续变为可用。我想将用户送回主页，但我不确定如何从这里开始。提前致谢。

Answer 1

您可以简单地附加一个 keyup/keydown 事件并获得点击按钮；$(document).keyup(function(e) {&nbsp; if (e.keyCode === 27){ // 27 is esc keycode&nbsp; &nbsp; &nbsp;$(this).dialog("close");&nbsp; &nbsp; &nbsp;document.location.href = "/";&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; }});但是，此事件将绑定在页面上，因此esc随时按下会将您重定向到主页。您要做的是添加一个var modalState将确定该对话框是否处于活动状态的。<script>&nbsp; &nbsp;var modalState = 0; // declare it outside, 0 means unopened&nbsp; &nbsp;$(function () {&nbsp; &nbsp; &nbsp; &nbsp;modalState = 1; // change it to active&nbsp; &nbsp; &nbsp; $("#dialog-login-message").dialog({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;modal: true,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;buttons: {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Ok: function () {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;document.location.href = "/";&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;$(this).dialog("close");&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;}&nbsp; &nbsp; &nbsp; });&nbsp; &nbsp;});&nbsp; &nbsp;$(document).keyup(function(e) {&nbsp; &nbsp; &nbsp; if (e.keyCode === 27){ // 27 is esc keycode&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;if(modalState == 1){ // check if dialog is active&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $(this).dialog("close");&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; document.location.href = "/";&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp;});</script>