<script type="text/javascript">
// 收縮展開效果
$(document).ready(function(){
$("a.click").toggle( function() {
$(this).parent().next("ul").show('fast');
}, function() {
$(this).parent().next("ul").hide('slow');
});
});
</script>
<ul class="sortSub" id="sortSub">
<li>
<a class="click"><span></span>相機配件</a>
<ul id="ul1">
<li><a href="../../list.html">支架</a></li>
<li><a href="../../list.html">機身附件</a></li>
<li><a href="../../list.html">清潔用品</a></li>
<li><a href="../../list.html">濾鏡</a></li>
<li><a href="../../list.html">電池-充電器</a></li>
<li><a href="../../list.html">相機包</a></li>
<li><a href="../../list.html">鏡頭</a></li>
<li><a href="../../list.html">閃光燈</a></li>
</ul>
</li>
<li>
<a class="click"><span></span>手機數碼配件</a>
<ul>
<li><a href="../../list.html">貼膜</a></li>
<li><a href="../../list.html">存儲卡</a></li>
<li><a href="../../list.html">手機殼-保護殼</a></li>
<li><a href="../../list.html">數據線</a></li>
<li><a href="../../list.html">電池-充電器</a></li>
<li><a href="../../list.html">移動電源</a></li>
<li><a href="../../list.html">藍牙耳機</a></li>
<li><a href="../../list.html">讀卡器</a></li>
<li><a href="../../list.html">其他配件</a></li>
</ul>
</li>
<li>
<a class="click"><span></span>攝像攝影</a>
<ul>
<li><a href="../../list.html">單反相機</a></li>
<li><a href="../../list.html">單電-微單相機</a></li>
<li><a href="../../list.html">拍立得</a></li>
<li><a href="../../list.html">攝像機</a></li>
<li><a href="../../list.html">數碼相機</a></li>
</ul>
</li>
<li>
<a class="click"><span></span>數碼影音</a>
<ul>
<li><a href="../../list.html">MP3-MP4隨身聽</a></li>
<li><a href="../../list.html">mini音響</a></li>
<li><a href="../../list.html">錄音筆</a></li>
<li><a href="../../list.html">數碼相框</a></li>
<li><a href="../../list.html">耳機-耳麥</a></li>
<li><a href="../../list.html">高清播放器</a></li>
<li><a href="../../list.html">麥克風-話筒</a></li>
</ul>
</li>
<li>
<a class="click"><span></span>其他電子</a>
<ul>
<li><a href="../../list.html">學習機</a></li>
<li><a href="../../list.html">對講機</a></li>
<li><a href="../../list.html">收音機</a></li>
<li><a href="../../list.html">電子書</a></li>
</ul>
</li>
</ul>
這個總是點擊一個展開鏈接,其他的就都一起展開或者收縮了。
<script>
$(function(){
//單獨選擇某一個
$("input[name='check_item']").click(function(){
var index=$("input[name='check_item']").index(this);
$("input[name='check_item']").eq(index).toggleClass("checked");//偽復選
});
//全選
$("#check_all,#box_all").click(function(){
$("input[name='check_item']").attr("checked",$(this).attr("checked"));
$("input[name='check_item'],#check_all,#box_all").toggleClass("checked");
});
});
$(function () {
//全選或全不選
$("#box_all").click(function(){
if(this.checked){
$("#list :checkbox").attr("checked", true);
}else{
$("#list :checkbox").attr("checked", false);
}
});
});
function allchk(){
var chknum = $("#list :checkbox").size();//選項總個數
var chk = 0;
$("#list :checkbox").each(function () {
if($(this).attr("checked")==true){
chk++;
}
});
if(chknum==chk){//全選
$("#box_all").attr("checked",true);
}else{//不全選
$("#box_all").attr("checked",false);
}
}
</script>
<section class="s-list cf" id="dataList">
<div class="wrap">
<form method="post" action="order.html">
<div class="container">
<div class="cart clear">
<div class="shadow">
<table width="100%" border="0">
<tr>
<td width="85%">
<h5 class="fl">購買到的產品</h5></li>
</td>
<td width="10%"> <input type="checkbox" class="checkbox" name="check_all" id="check_all" > </td>
</tr>
</table>
<div class="c_list cb">
<ul>
<li>
<table>
<tr>
<td width="15%"><img src="images/cart_img.jpg" width="52" height="44"></td>
<td width="65%">
<p>新奇士臍橙,8斤,甜中帶微</p>
<p><span class="lse">¥198.00</span> <span class="pl15">數量:<input type="text" name="num" class="num"> 包</span></p>
</td>
<td width="10%" valign="middle"><a href="#" class="del">刪除</a></td>
<td width="10%"> <input type="checkbox" class="checkbox" name="check_item" id="check_item"></td>
</tr>
</table>
</li>
<li>
<table>
<tr>
<td width="15%"><img src="images/cart_img.jpg" width="52" height="44"></td>
<td width="65%">
<p>新奇士臍橙,8斤,甜中帶微</p>
<p><span class="lse">¥198.00</span> <span class="pl15">數量:<input type="text" name="num" class="num"> 包</span></p>
</td>
<td width="10%" valign="middle"><a href="#" class="del">刪除</a></td>
<td width="10%"> <input type="checkbox" class="checkbox" name="check_item" id="check_item"></td>
</tr>
</table>
</li>
<li>
<table>
<tr>
<td width="15%"><img src="images/cart_img.jpg" width="52" height="44"></td>
<td width="65%">
<p>新奇士臍橙,8斤,甜中帶微</p>
<p><span class="lse">¥198.00</span> <span class="pl15">數量:<input type="text" name="num" class="num"> 包</span></p>
</td>
<td width="10%" valign="middle"><a href="#" class="del">刪除</a></td>
<td width="10%"> <input type="checkbox" class="checkbox" name="check_item" id="check_item"></td>
</tr>
</table>
</li>
<li>
<table>
<tr>
<td width="15%"><img src="images/cart_img.jpg" width="52" height="44"></td>
<td width="65%">
<p>新奇士臍橙,8斤,甜中帶微</p>
<p><span class="lse">¥198.00</span> <span class="pl15">數量:<input type="text" name="num" class="num"> 包</span></p>
</td>
<td width="10%" valign="middle"><a href="#" class="del">刪除</a></td>
<td width="10%"> <input type="checkbox" class="checkbox" name="check_item" id="check_item"></td>
</tr>
</table>
</li>
<li>
<table>
<tr>
<td width="15%"><img src="images/cart_img.jpg" width="52" height="44"></td>
<td width="65%">
<p>新奇士臍橙,8斤,甜中帶微</p>
<p><span class="lse">¥198.00</span> <span class="pl15">數量:<input type="text" name="num" class="num"> 包</span></p>
</td>
<td width="10%" valign="middle"><a href="#" class="del">刪除</a></td>
<td width="10%"> <input type="checkbox" class="checkbox" name="check_item" id="check_item"></td>
</tr>
</table>
</li>
<li>
<table>
<tr>
<td width="15%"><img src="images/cart_img.jpg" width="52" height="44"></td>
<td width="65%">
<p>新奇士臍橙,8斤,甜中帶微</p>
<p><span class="lse">¥198.00</span> <span class="pl15">數量:<input type="text" name="num" class="num"> 包</span></p>
</td>
<td width="10%" valign="middle"><a href="#" class="del">刪除</a></td>
<td width="10%"> <input type="checkbox" class="checkbox" name="check_item" id="check_item"></td>
</tr>
</table>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="cart_bg">
<table width="100%" border="0">
<tr>
<td width="3%"></td>
<td width="25%"><input type="checkbox" class="checkbox" id="box_all"> 全選</td>
<td width="49%">
<p> <span class="pl15">金額合計:</span><span class="ff6">¥198.00</span></p>
</td>
<td width="20%"><button class="submit">去結算</button></td>
<td width="3%"></td>
</tr>
</table>
</div>
</form>
</div>
</section>
全選這個我看不懂該怎麼添加完整,判斷是否全部被選中
求大神補完~~~~跪求
第一個你代碼就是錯的,parent得到li,ul是在li下,你調用next是同輩元素
$("a.click").click(function () {
$(this).next().toggle('fast');
$(this).parent().siblings().find('ul').hide('slow');
});
給列表容器增加id,判斷下總個數和勾選總個數是否一致就好了
<div class="c_list cb" id="list">
if ($("#list :checkbox").length != $("#list :checkbox:checked").length) {
alert('沒有勾選所有商品')
}