我目前正在尝试制作用户设置页面。在此页面上,用户可以通过按下打开弹出窗口的按钮来更改其电子邮件。在这个弹出窗口中,他应该能够输入他的新电子邮件。 问题是,当我按 Alt 键时,我失去了输入的焦点。所以...我无法输入任何电子邮件地址,因为我无法添加" @" (是的,我是法国人,我有一个AZERTY键盘:/)。
我的问题是:我能做些什么来不失去焦点?
我在Meteor和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 键时,我都失去了对两者的关注。我不明白为什么。
答案 0 :(得分:2)
这是因为你正在使用Ubuntu。 在ubuntu上,alt键是一个系统键,绑定到“键入你的命令”。
参考: https://github.com/Guake/guake/issues/352
因此,如果您的客户没有使用ubuntu + Azerty键盘,那就没关系。
作为一个脏修复,您可以在按下某个键时捕获一个事件,如果此键是alt,则只需强制使用
document.getElementById('email').focus();
答案 1 :(得分:0)
尝试使用JS DOM focus()函数。
如果仅在弹出窗口的文本字段中设置焦点,则可以正常工作。
例如:
document.getElementById('email').focus();