Jquery 关注输入时如何更改背景位置

我想在输入有焦点时更改字段div的背景图像位置。有没有想过用jquery来实现这一点？谢谢。

我还没有尝试过，但我认为以下方法应该有效：

<div class="field">
    <input name="password" type="password" />
</div> 

---

您可以观察密码输入上的

focus

事件，然后使用jQuery的方法更改目标上的

background position

CSS属性

---

然后只需设置.field.focus classes背景位置。

此解决方案适用于所有输入字段，并允许您将表示标记与函数jQuery分开。

$('input:password').focus(
    function(){
        $(this).parent().css({'background-position': 'Xpx Ypx'});
    }).blur(
    function(){
        $(this).parent().css({'background-position': 'Xpx Ypx'});
    });

$('div.field input[name="password"]').focus(function() {
    $(this).closest('div.field').css('background-position', '10px 10px');
});

$('.field input').focus(function() {
    $(this).addClass('focus')
});