0

チェックボックスがオンになっているときに、次のコードを使用して div スタイルを更新しています。

http://jsfiddle.net/tPawr/6/

$(document).ready(function() {
    var checkbox = $('input[type="checkbox"]');
    var checkimage = $('<div class="checkbox-image" />');
    $(checkbox).each( function() {
        $(this).show().before( checkimage );
    });
    $(checkbox).prop('checked', function() {
        $('.checkbox-image').addClass('checked');
    });
    $('checkbox-image').on('click',function() {
        $(this).toggleClass('checked').after().prop('checked',$(this).is('.checked'));
    });
});

正常に機能していたのに、機能しなくなったのですが、原因がわかりません。誰でも助けることができますか?

4

2 に答える 2

1

あなたはドットを残しました:

$('.checkbox-image').on('click',function(){
   ^

フィドル

于 2013-09-19T02:41:36.423 に答える
0

jQuery ライブラリはフィドルに含まれていませんでした - (LHS パネルで、最初のドロップダウンで jQuery バージョンを選択します)

checkbox-image前が欠けているため、セレクターが間違っていました.

また、コードは次のように簡略化できます

$(document).ready(function() {

    var checkbox = $('input[type="checkbox"]');
    var checkimage = $('.checkbox-image');

    checkimage.click(function(){
        $(this).toggleClass('checked').next().prop('checked',$(this).is('.checked'));
    }); 

    checkbox.change(function(){
        checkimage.toggleClass('checked', this.checked)
    }).change();

});

デモ:フィドル

于 2013-09-19T02:39:31.957 に答える