如何在关注输入时改变背景位置

Question

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

我想在焦点输入时更改背景图像的场div的位置。有任何想法用jquery吗？感谢。

Answer 1

我没试过这个，但我认为以下内容应该有效：

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

Answer 2

您可以在密码输入上查看focus事件，然后使用jQuery的css()方法更改目标上的background-position CSS属性。

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

Answer 3

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

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