懸停事件檢查單選按鈕？

Question

是否可以通過鼠標懸停控制單選按鈕的顯示？

目標是這樣的，當鼠標結束時，它會看起來被檢查，當鼠標離開時，它會被取消選中。但它只在點擊時被檢查，就像評分一樣。

Answer 1

您可以使用這樣的事情：

$("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/

Answer 2

與它擺弄一點點後，我想出了這個...看看這個fiddle並看看是否有技巧...哦，因爲你沒有提到任何特定的語言，所以我用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); 
    } 

});