當單選按鈕被選中時，如何使用jquery mobile顯示div？

Question

這裏是關於我的問題的JSFiddle。 http://jsfiddle.net/kane/MFJUv/

我試了幾件事情來顯示/隱藏下拉（div id：machinedropdown）。

負載上我希望機器下拉菜單隱藏，但是當用戶選擇需要顯示的「機器」單選按鈕時。任何人都可以爲我提供解決方案嗎？

<div data-role="content" id="radio" 
    <form> 
     <fieldset data-role="controlgroup" data-type="horizontal" class="center-controlgroup"> 
      <input name="radio-choice-h-6" id="radio-choice-h-6a" type="radio" checked="checked" value="on"> 
      <label for="radio-choice-h-6a">Run</label> 
      <input name="radio-choice-h-6" id="radio-choice-h-6b" type="radio" value="off"> 
      <label for="radio-choice-h-6b">Swim</label> 

      <!-- ON SELECT I NEED TO HIDE THE "div id = "machinedropdown" --> 
      <input name="radio-choice-h-6" id="radio-choice-h-6c" type="radio" value="off"> 
      <label for="radio-choice-h-6c">Machine</label> 
     </fieldset> 
</form> 
</div> 

<div data-role="content" id="machinedropdown" 
    <label class="select" for="select-choice-1">Select, native menu</label> 
     <select name="select-choice-1" id="select-choice-1"> 
     <option value="standard">Machine 1</option> 
     <option value="rush">Machine 2</option> 
     <option value="express">Machine 3</option> 
     <option value="overnight">Machine 4</option> 
    </select> 
</div> 

Answer 1

做到這一點的一種方法是檢查無線電是否都被檢查並且它是包含特定於機器的ID的元素。

---

首先，您將下降的初始狀態下隱藏：

$('#machinedropdown').hide(); 

接下來，你聽收音機輸入更改事件 - 如果輸入托運和有ID爲machine輸入（radio-choice-h-6c），您將設置下拉列表以顯示 - 否則，請將其重新設置爲隱藏（以便將所選單選按鈕從machine更改爲其他選項時，該下拉列表不會再顯示）：

$('input').change(function(){ // On change of radio buttons 
    if ($(this).is(':checked') && $(this).attr('id') == 'radio-choice-h-6c') { 
     $('#machinedropdown').show(); 
     // If the radio button is checked and has the machine id, show the drop down. 
    } 
    else { 
     $('#machinedropdown').hide(); 
     // Else, re-hide it. 
    } 
}); 

---

jsFiddle here.