JQueryでホバーのチェックボックスでCSSスタイルを変更するには

Question

私がしようとしているのは、自分の上にマウスを置くと、自分のチェックボックスの背景色を変更することだけです。しかし、これは、td input:checkboxが動的に作成されているために、より複雑になります。私は考えられるすべてのアプローチを試みてきましたが、私はそれを正しくすることはできません。

/* snip */ 
    $('.table_products').on('click', 'td input:checkbox', function() { 

    $("input:checkbox").hover(function(){ 
     $(this).css({"backgroundColor": "yellow"}); 
    }, function(){ 
     $(this).css({"backgroundColor": "white"}); 
    }); 
/* snip */ 

Answer 1

を多分チェックボックスの四角内の色を変更することはできませんが、@gavgrifが言ったようにあなたがだますことができます：ここではjQueryのは、私が持っています。

$("input[type='checkbox']").hover(function(){ 
    $(this).closest(".wrapper").css("background-color", "yellow"); 
}, function(){ 
    $(this).closest(".wrapper").css("background-color", "white"); 
}); 

おそらくあなたのセレクタがあまりにもworngた（宣言するための正しい方法は、[]の中にある）：あなたは（全体ではなく、TDの）チェックボックスを渡すとき、私はちょうど置きます。

私はちょうどチェックボックスを包んだけど、あなたの現在の親を使用することができます。

<div class="wrapper"> 
    <input type="checkbox"/> 
    </div> 

Plunker：https://plnkr.co/edit/5V5cUysB9E0SYGMddFKl?p=preview