jQuery的：當複選框被選中/取消更改下拉列表中選擇

Question

我有這樣的形式：

<input type="checkbox" value="First" />First 
<input type="checkbox" value="Second" />Second 
<input type="checkbox" value="Third" />Third 

<select name="first-drop"> 
    <option value="---">---</option> 
    <option value="Option1">Option1</option> 
    <option value="Option2">Option2</option> 
</select> 

有（使用JS/jQuery的）我的first-drop值更改爲---的方式每當First檢查框未選中？

Answer 1

$('input[type="checkbox"][value="First"]').change(function(){ 
    $('select[name="first-drop"]').toggle(); 
});​ 

LIVE DEMO

請注意，我定你的標記：

<input type="checkbox" value="First" checked="checked" >First 
<input type="checkbox" value="Second" />Second 
<input type="checkbox" value="Third" />Third 

<select name="first-drop"> 
    <option value="">---</option> 
    <option value="Option1">Option1</option> 
    <option value="Option2">Option2</option> 
</select>​ 

---

更新：

你現在想要的是：

$('input[type="checkbox"][value="First"]').change(function() { 
    if (!this.checked) { 
     $('select[name="first-drop"] option:first').prop('selected', 'selected'); 
    } 
}); 

​LIVE DEMO

如果你會給你的DOM元素的ID也可以是這麼簡單：

$('#first').change(function() { 
    if (!this.checked) 
     $('#nothing').prop('selected', 'selected'); 
}); 

更新DOM：

<input type="checkbox" value="First" id="first" >First 
<input type="checkbox" value="Second">Second 
<input type="checkbox" value="Third">Third 

<select name="first-drop"> 
    <option value="" id="nothing" >---</option> 
    <option value="Option1" >Option1</option> 
    <option value="Option2">Option2</option> 
</select>​ 

LIVE DEMO

Answer 2

我添加了一個ID，以第一個複選框

<input id="first" type="checkbox" value="First">First</input> 
<input type="checkbox" value="Second">Second</input> 
<input type="checkbox" value="Third">Third</input> 

<select name="first-drop"> 
    <option value="">---</option> 
    <option value="Option1">Option1</option> 
    <option value="Option2">$Option2</option> 
</select> 

<script type="text/javascript"> 
    $(function() { 
     $("#first").click(function() { 
      if ($(this)[0].checked == true) { 
       $("[name='first-drop'] option:first").attr("selected", "selected"); 
      } 
     }); 
    });​ 
</script> 

演示：

http://jsfiddle.net/8BtYc/2/

編輯：修正了我的代碼，因此它不會如果沒有選擇第一個複選框切換