引导盒输入失去了对替代键的焦点

Bootbox input lost focus on alt key

本文关键字:焦点 输入 失去      更新时间:2023-09-26

我目前正在尝试制作用户设置页面。在此页面上,用户可以通过按下打开弹出窗口的按钮来更改其电子邮件。在此弹出窗口中,他应该能够输入他的新电子邮件。问题是,当我按 Alt 键时,我失去了输入的焦点。所以。。。我无法输入任何电子邮件地址,因为我无法添加"@"(是的,我是法国人,我有一个 AZERTY 键盘:/)。

我的问题是:我能做些什么来不失去注意力?

我在Meteor and Jade中开发我的网络应用程序。这是我的弹出模板:

template(name="change_mail")
  table.table.table-responsive.large-table
    tbody
      tr
        td {{_ "current_mail" }} :
        td.table-text#old-mail
      tr
        td {{_ "new_mail" }} :
        td
          input.black#new-mail(type="text" name="mail")

和我的控制器:

Template.change_mail.rendered = function ()
{
  document.getElementById('new-mail').focus(); // Don't work 
}
"click #change_mail": function (event, template)
{
    event.preventDefault();
    var user = Meteor.user();
    bootbox.dialog(
    {
        title : t('change_mail'),
        message : "<div id='dialogNode'></div>",
        className : "info-popup",
        buttons : 
        {
            cancel :
            {
                label : t('back'),
                className : "btn-default btn-lg"
            },
            success : 
            {
                label : t('update'),
                className : "btn-info btn-lg",
                callback : function ()
                {
                    var mail = $("#new-mail").val();
                    if (mail === "")
                    {
                        return;
                    }
                    else
                    {
                        Meteor.call('updateMail', user._id, mail);
                        displayPopup(t("success"), t("success_change_mail"), t("ok"), "btn-success btn-lg", "success-popup");
                    }
                }
            }
        }
    });
    Blaze.render(Template.change_mail, $("#dialogNode")[0]);
    $("#old-mail").text(user.emails[0].address);
},

编辑:我尝试使用Magnific Popup更改库。当弹出窗口打开时,我得到了焦点,但我立即失去了它。无论如何,当我按 Alt 键时,我失去了对两者的关注。我不明白为什么。

这是因为您使用的是 Ubuntu。在 ubuntu 上,alt 键是绑定到"键入你的命令"的系统键。

参考:https://github.com/Guake/guake/issues/352

因此,如果您的客户不使用ubuntu + Azerty键盘,那很好。

作为一个肮脏的修复,您可以在按下某个键时捕获事件,如果此键是alt,只需强制焦点

document.getElementById('email').focus();

尝试使用 JS DOM focus() 函数。

如果焦点仅设置在弹出窗口中的文本字段上,则可以工作。

例如:

document.getElementById('email').focus();