0

これをカスタム ラジオ ボタンとチェックボックスに使用していますが: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;
    }
}
4

1 に答える 1

2

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');
于 2012-10-11T16:26:21.320 に答える