如何复制JavaScript's的提示函数在一个带有密码字段的新模式中

How I can I replicate JavaScript's prompt function in a new modal with a password field?

本文关键字:一个 密码 新模式 模式 字段 提示 JavaScript 复制 何复制 函数      更新时间:2023-09-26

我正在为内部员工应用程序重新编写一个模块。该应用程序目前使用JavaScript提示窗口执行某些操作,提示窗口要求提供每个员工唯一的pin代码。然后,针对该特定操作将该代码记录在系统中。

不幸的是,使用JavaScript提示窗口,任何看屏幕的人都可以看到输入的文本。我正在尝试重新创建这个提示函数,但使用了密码过滤器。为此,我创建了一个Modal,并使用了一个类型设置为password的输入标记。

我遇到的唯一问题是,模式代码是非阻塞的,检查现在被忽略了。以前的提示功能是阻塞的,代码会等待回复。

如何在模态中复制JavaScript的提示功能及其阻塞性?

对于这种类型的问题,我强烈建议使用jQuery UI。它使用起来非常简单,而且你很快就能达到你想要的效果。下面是一个简单的演示:http://jsfiddle.net/ecq80jd2/

代码:

<body>
    <div id="dialog" title="Enter a value">
        <input type="password" id="test" />
    </div>
    <a href="#">Can't Click Me until a value is entered into dialog box</a>
    <script>
        $(document).ready(function () {
            $("#dialog").dialog({
                autoOpen: true,
                modal: true,
                closeOnEscape: false,
                buttons: {
                    OK: function () {
                        if ($("#test").val() != "") {
                            alert($("#test").val());
                            $(this).dialog("destroy").remove();
                        }
                    }
                }
            })
        });
    </script>
    <style>
        .ui-dialog-titlebar-close {
          visibility: hidden;
        }
    </style>
</body>
相关文章: