2012-01-23 22 views
0

兩個選項 點擊複選框1則顯示,選擇2 點擊第2款則顯示ABCDEjQuery的輸入複選框checkall或一些

選項1個優良工程

我在哪兒上的選項2

腳麻

我想它選擇ABCD和E的一個

這是jQuery的

$(document).ready(function() { 
    $('.child').hide(); 
    $(".parent").click(function() { 
     $('#form' + $(this).attr('id')).toggle(); 
     $(this).parents('fieldset:eq(0)').find(':checkbox').attr('checked', this.checked); 
    }); 

}); 

這是HTML

<fieldset> 
     <p> 
      <label for="5">1</label> 
      <input type="checkbox" name="1" id="5" value="360" class="parent" />$360 
     </p> 
     <p id="form5" class="child"> 
      <label for="6">2</label> 
      <input type="checkbox" name="2" id="6" value="2" />$180 
     </p> 
    </fieldset> 
<fieldset> 
<p name="4" id="1st" class="parent">a</p> 
<p id="form1st" class="child"> 
     <label for="7">a</label> 
     <input type="checkbox" name="a" id="7" value="25" />$25 
<br /> 
     <label for="8">b</label> 
     <input type="checkbox" name="b" id="8" value="18" />$18 
<br /> 
     <label for="9">c</label> 
     <input type="checkbox" name="c" id="9" value="18" />$18 
<br /> 
     <label for="10">d</label> 
     <input type="checkbox" name="d" id="10" value="18" />$18 
<br /> 
     <label for="11">e</label> 
     <span id="11"> 
       <input type="checkbox" name="?" value="18" />e1 
       <input type="checkbox" name="?" value="36" />e2 
       <input type="checkbox" name="?" value="54" />e3 
       <input type="checkbox" name="?" value="72" />e4 
       <input type="checkbox" name="?" value="90" />e5 
       <input type="checkbox" name="?" value="100" />e6 
       <input type="checkbox" name="?" value="" />other 
     </span> 
    </p> 
</fieldset> 

並演示

http://jsfiddle.net/vRXU3/

+0

喜,不能夠了解你的問題..你需要做什麼? – Murtaza

+0

@Murtaza第一個作品的第二個我想當我點擊「a」,它顯示並選擇父域字段中的複選框ids 7到11 – Dasa

+0

已嘗試通過我的答案... – Murtaza

回答

2

這是你的問題。

this.checked在 '選項2' 未定義

.attr('checked', this.checked) 

當你在

<input type="checkbox" name="1" id="5" value="360" class="parent" /> 

點擊,因爲它是一個複選框,它有cheched屬性它的工作原理。但是,當你點擊

<p name="4" id="1st" class="parent">a</p> 

以 '這個' 你是指它有沒有<p>元素checked屬性

- 更新

$(".parent").click(function() { 

    var $target = $(event.target); 
    var valueOfChecked; 
    if ($target.is("input:checkbox")) { 
     valueOfChecked = $target.attr('checked'); 
    } else { 
     valueOfChecked = 'checked'; 
    } 
    $(this).parents('fieldset:eq(0)').find('p > input:checkbox').attr('checked', valueOfChecked); 
    $(this).parents('fieldset:eq(0)').find('p > span input:checkbox').first().attr('checked', valueOfChecked); 
}); 

jsfiddle updated example

+0

謝謝@zdrsh,你怎麼建議我去做這件事? – Dasa

+0

我已經更新了我的答案。你有沒有看到它的問題? – zdrsh

+0

是的跨度也應該顯示,但只有值18檢查。 – Dasa

0

我會請你到你的腳本改爲:

$(document).ready(function() { 
    $('.child').hide(); 
    $(".parent").click(function() { 
     $('#form' + $(this).attr('id')).toggle(); 
     $(this).parents().find('input:checkbox').attr('checked', this.checked); 
    }); 

}); 

更新$(this).parents('fieldset:eq(0)').find(':checkbox').attr('checked', this.checked);

刪除'fieldset:eq(0)'這不是必需的。