イベント上でマウスを使用してラジオボタンの表示を制御することは可能ですか?
目標は、マウスが上にあるときはチェックされているように見え、マウスが離れているときはチェックされていないように見えるようにすることです。ただし、評価と同じようにクリックされた場合にのみチェックされます。
イベント上でマウスを使用してラジオボタンの表示を制御することは可能ですか?
目標は、マウスが上にあるときはチェックされているように見え、マウスが離れているときはチェックされていないように見えるようにすることです。ただし、評価と同じようにクリックされた場合にのみチェックされます。
少しいじった後、私はこれを思いついた...このフィドルをチェックして、トリックがうまくいくかどうかを確認してください...ああ、あなたは特定の言語について言及していなかったので、jQueryでこれを達成しました...それを願っています役立ちます
これは完璧なソリューションではないかもしれませんが、要件を確実に満たしています。
HTML:
<input type="radio" name="cols" id="col-1" />
<br />
<input type="radio" name="cols" id="col-2" />
<br />
<input type="radio" name="cols" id="col-3" />
JS:
var clicked = false;
var clickedId;
$('input').click(function () {
clicked = true;
clickedId = $(this).attr('id');
});
$('input').hover(function () {
$(this).prop('checked', true);
}, function () {
if (clicked === true) {
$('#' + clickedId).prop('checked', true);
} else {
$(this).prop('checked', false);
}
});
次のようなものを使用できます。
$("input:radio").hover(function(){
$(this).prop('checked', true);
}, function(){
//MouseOut event
$(this).prop('checked', false);
}).click(function(){
//Unbind the hover event for all the radio buttons
$("input:radio").unbind('mouseenter mouseleave')
//Check clicked radio button
$(this).prop('checked', true);
});
私はあなたのためにフィドルを作りました: http://jsfiddle.net/B6qBz/