javascript - 更改背景图像时将键盘焦点保留在文本字段上

Question

我正在使用以下代码更改登陆屏幕的背景图片。

window.onload = function() {
setTimeout(changeBackground, 1000);
};
var currentBackground = 0;
var backgrounds = [];
backgrounds[0] = '<?php echo base_url(); ?>images/background.png';
backgrounds[1] = '<?php echo base_url(); ?>images/background2.png';
backgrounds[2] = '<?php echo base_url(); ?>images/background3.png';
backgrounds[3] = '<?php echo base_url(); ?>images/background4.png';
function changeBackground() {
    currentBackground++;
    if(currentBackground > 3) currentBackground = 0;

    $('body').fadeOut(0, function() {
        $('body').css({
            'background-image' : "url('" + backgrounds[currentBackground] + "')"
        });
        $('body').fadeIn(0);
    });


    setTimeout(changeBackground, 3000);
}

一切正常。但是，在 Internet Explorer 中，当我尝试在文本框中输入用户名时，当它更改背景图像时，文本字段内的焦点会丢失，每次更改背景图像时我都需要单击。

谁能指导如何克服这个问题。

Answer 1

您可能可以通过在每次背景更改时显式设置焦点来克服这个问题。将以下行添加到您的 changeBackground() 函数(也许它应该是最后一行...):

document.getElementById("...文本框的ID...").focus();

请记住，这可能会导致另一个问题，即在背景更改之前故意更改焦点。如果这是可能的，那么您真正想要做的是在背景更改时检测哪个元素具有焦点，保留它，而不是将其显式设置为该元素。这是使用 document.activeElement 命令完成的。