jquery - 禁用单选按钮单击上的下拉框

Question

我有两个单选按钮和一个下拉框，如下所示。我想做的是: 1. 选中“否”时，隐藏或灰显下拉框，然后 2. 当选中 yes 时，显示下拉框。

如有任何指点，我们将不胜感激!

<td colspan="4">
<input name="discount" type="radio" id="Yes" value="Yes" />Yes
<input name="discount" type="radio" id="No" value="No" checked="checked" />No<br />  
<select class="purple" name="discountselection" id="discountselection">
<option value="1 Year" selected="selected">1 Year</option>
<option value="2 Years">2 Years</option>
<option value="3 Years">3 Years</option>
</select>                  
</td>

Answer 1

   <script type="text/javascript">
                   $("#Yes").click(function() {
                        $("#discountselection").attr("disabled", false);
                        //$("#discountselection").show(); //To Show the dropdown
                    });
                    $("#No").click(function() {
                        $("#discountselection").attr("disabled", true);
                        //$("#discountselection").hide();//To hide the dropdown
                    });
    </script>

此外，还可以根据页面加载时选择的默认单选按钮设置下拉列表的显示样式或 HTML 中的禁用属性。

 <select  name="discountselection" id="discountselection" disabled="disabled">
    <option value="1 Year" selected="selected">1 Year</option>
    <option value="2 Years">2 Years</option>
    <option value="3 Years">3 Years</option>
    </select>