如何在JQuery中切換選中的單選按鈕？

Question

我創建了兩個單選按鈕：

<form> 
     <p><input type="radio" name="center" value="center">Center</p> 
     <p><input type="radio" name="right" value="right">Lower Right</p> 
    </form> 

和jQuery腳本來移動一個div的位置，它的工作，但我有兩個問題：

1）當我檢查單選按鈕，它當我檢查另一個時，將不會取消選中，因爲我使用了不同的名稱，因此我需要點擊事件。

2）中心位置和右下角是硬編碼的。

任何想法將不勝感激。

<script> 
      $(function(){ 
       $(init); 
       function init(){ 
        $('#target').draggable(); 
       } 
       $('input[name=center]:radio').click(function(){ 
        $('#target').css({ 
         position:'absolute', 
         top:200 + 'px', 
         left:45 + 'px' 
        }); 
       }); 
       $('input[name=right]:radio').click(function(){ 
        $('#target').css({ 
         position:'absolute', 
         top:550 + 'px', 
         right:200 + 'px' 
        }); 
       }); 
      }); 
    </script> 

Answer 1

使用ID屬性來區分單擊事件處理程序中的元素。保持單選按鈕名稱相同。這樣，你不必破解一個解決方案;您可以使用瀏覽器的默認功能：

<form> 
    <p><input type="radio" id="center" name="someFormValue" value="center" />Center</p> 
    <p><input type="radio" id="right" name="someFormValue" value="right" />Lower Right</p> 
</form>