如何在特定範圍內定位圖像？

Question

我正在構建一個多選題調查問卷，使用jQuery在懸停時切換單選按鈕。我對每個可能的答案都有一個範圍，在裏面我有單選按鈕，我想在懸停時交換源。

現在這些是我製作的圖像，而不是實際的單選按鈕。我有兩個圖像，選中和取消選中，當用戶懸停時，我交換了src。

因此，當用戶將鼠標懸停在單選按鈕本身或單選按鈕旁邊的實際文本上時，該按鈕顯示一個點。

這裏是我的跨度，包含單選按鈕和文本（請記住我有這些5）。

<span class='choice' id='A'><img src="images/radioUnchecked.png" width="20" height="21" class='radioButton'>A) Naked woman</span> 

那麼我將如何使用jQuery當用戶將鼠標懸停在該文本爲目標的單選按鈕？

編輯： 這裏是jQuery我是使用切換，但它只適用於當用戶懸停在圖像上。

$('img.radioButton').hover(function() { 
    this.src = 'images/radioChecked.png'; 
}, function() { 
    this.src = 'images/radioUnchecked.png'; 
}); 

Answer 1

$('span.choice').hover(function() { 
    $('img.radioButton', this).attr('src', 'images/radioChecked.png') 
}, function() { 
    $('img.radioButton', this).attr('src', 'images/radioUnchecked.png') 
}); 

如果你有choice類的更多元素，那麼你可以嘗試以下操作：

$('span.choice').has('img.radioButton').hover(function() { 
    $('img.radioButton', this).attr('src', 'images/radioChecked.png') 
}, function() { 
    $('img.radioButton', this).attr('src', 'images/radioUnchecked.png') 
}); 

$('span.choice').has('img.radioButton')將檢測到含有img.radioButton只有跨度。