更改CSS选择器与jQuery之前的背景位置

Question

我使用this作为自定义单选按钮和复选框，但我需要在单击时更改:before元素的背景。可能吗？

HTML

<div class="checkbox"> 
<input type="checkbox" value="1" name="test"> 
</div> 

CSS（其.LESS）

.checkbox { 
    display: inline-block; 
    margin: 0 4px 0 0; 
    cursor: pointer; 
    text-align: left; 
    padding: 0px; 

    input { display: none; } 

    &:before { 
     background: url(/img/checkboxes.png) no-repeat; 
     content: ""; 
     float: left; 
     height: 18px; 
     width: 19px; 
     margin: 0; 
    } 
} 

Answer 1

您不能选择使用jQuery伪元素，我想说的干净的解决方案是操作类的元素使用jQuery：

.checkbox { 
    display: inline-block; 
    margin: 0 4px 0 0; 
    cursor: pointer; 
    text-align: left; 
    padding: 0px; 

    input { display: none; } 

    &:before { 
     background: url(/img/checkboxes.png) no-repeat; 
     content: ""; 
     float: left; 
     height: 18px; 
     width: 19px; 
     margin: 0; 
    } 

    &.someclass:before { 
     background-position:0 -55px; 
    } 
} 

然后：

$('.checkbox').addClass('someclass');