个人中心
gpt4 book ai didi

javascript - jQuery UI 对话框无法打开

转载 作者：行者123 更新时间：2023-12-03 12:20:07 25 4
gpt4 key购买 nike

我试图调出一个 jQuery UI 对话框来响应表单输入。考虑:

<html>
   <head>
      <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.css" />
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
      <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> 
      <script src="checkLogin.js"></script>
   </head>
   <body>
      <form>
         <label>User Name:</label><input onkeydown="checkSubmitKey(event)"><br>
         <input id="submit" name="submit" type="button" onclick="checkLogin()" value="Submit">
      </form>
      <div id="dialog" title="Alert" style="display: none;"></div>
   </body>
</html>

其中 checkLogin.js 是:

function checkSubmitKey(ev) {
    if(ev.keyCode == 13) {
        checkLogin();
    }
}

function checkLogin() {
   showAlert("Hello");
}

function showAlert(str) {
    $( "#dialog" ).html(str);
    $( "#dialog" ).dialog({
        modal: true,
        title: "Alert",
        buttons: {
            "OK": function() {
                $( this ).dialog( "close" );
            }
        }
    });
}

问题是该对话框仅在我按下“提交”按钮时显示；如果我在“用户名”文本字段中按 Enter，则不会发生任何情况。

(如果我将函数 checkLogin 更改为 

function checkLogin() {
   alert("ok");
   showAlert("Hello");
}

当我按 Enter 时也会出现该对话框。)

最佳答案

您需要阻止 Enter 键的默认操作。将 JS 更改为:

function checkSubmitKey(ev) {
    if(ev.keyCode == 13) {
        ev.preventDefault();
        checkLogin();
    }
}

FIDDLE

关于javascript - jQuery UI 对话框无法打开，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24480124/

25 4 0
文章推荐： JavaScript 全屏 API
文章推荐： javascript - 通过 Angular UI 模式更新复杂模型时遇到问题
文章推荐： javascript - AngularJS ng-if 根据路由位置显示标题内容
文章推荐： javascript - 使用 JavaScript 中的动态变量更新 div id
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com