ラジオボタンの値を変更し、jqueryを使ってクラスを追加する

Question

私はユーザーのjqueryを使って、バックグラウンドイメージからなるdivのペアにクラスを追加/削除しようとしています。 div/imageは、隠れたラジオボックスのペアのラジオボックスとして機能することを意図しています。

div/imageをクリックすると、スクリプトはクリックされたdivに 'selected'クラスを適用し、必要に応じて他のものから削除する必要があります。適切な隠しラジオボタンを選択します。

私の知る限りでは、以下のスクリプトはうまくいくはずですが、そうではありません。私は現在間違っています。任意のアイデアスタッカー？

SCRIPT

$("div#like").click(function() { 
    var $radios = $('input:radio[name=vote]'); 
    $("div#dislike").removeClass("selected"); 
    $("div#like").addClass("selected"); 
     $radios.filter('[value=likes]').attr('checked', true); 
}); 

$("div#dislike").click(function() { 
    var $radios = $('input:radio[name=vote]'); 
    $("div#like").removeClass("selected"); 
    $("div#dislike").addClass("selected"); 
     $radios.filter('[value=likes]').attr('checked', true); 
}); 

HTML

<form action="createComment.php" method="post"> 
<div id="like" ><input class="like" type="radio" name="vote" value="likes" /></div>&nbsp; 
<div id="dislike" ><input class="dislike" type="radio" name="vote" value="dislikes" /></div><br/> 
</form> 

[EDIT 15:07]私はこのルートを行った場合はどうすれば ？

$("div#like").click(function() { 
    var $radios = $('input:radio[name=vote]'); 
     $("div#dislike").removeClass("selected"); 
     $("div#like").addClass("selected"); 
     $radios.filter('[value=likes]').attr('checked', true); 
     $radios.filter('[value=dislikes]').attr('checked', false); 
    }); 

$("div#dislike").click(function() { 
    var $radios = $('input:radio[name=vote]'); 
     $("div#like").removeClass("selected"); 
     $("div#dislike").addClass("selected"); 
     $radios.filter('[value=dislikes]').attr('checked', true); 
     $radios.filter('[value=likes]').attr('checked', false); 
    }); 

Answer 1

属性checked="checked"をjavascriptを使用して設定しないでください。代わりに、あなたが行うことができますjqueryのを使用して

radioButton.checked = true

を使用し、ここで

$radios.filter('[value=likes]').get(0).checked = true 

は、あなたのためのちょっといい例ですhttp://jsfiddle.net/cu2y8/6/

Answer 2

クリックしたdivに関係なく、[value = likes]ボタンではtrueに設定されています。

嫌いなdivをクリックしたときに[値=嫌い]ボタンを必ず選択してください。