首页 > 代码库 > 【JQ成长笔记】关于$(this).index与$.each的使用
【JQ成长笔记】关于$(this).index与$.each的使用
本人菜鸟入门，小庙容不下大神的 O(∩_∩)O~~轻喷~
工作当中响应某个需求，切换选项卡的一个效果，根据每个选项下的内容元素的总数不同而进行不同的html变化（如果选项卡下的内容为空就等于XXX，否则就XXX）
1 $(function(){ 2 $(".bao").hide(); 3 $(".bao").eq(0).show(); 4 $(".head li").click(function(){ 5 $(this).addClass(‘cur‘).siblings().removeClass("cur"); 6 $(".bao").eq($(this).index()).show().siblings(".bao").hide() 7 var a=$(".bao").eq($(this).index()).find(‘li‘) 8 if(a.length<0){ 9 alert("我小于0啊!!")10 }11 });12 13 function moren(){14 var moren=$(".moren").find(‘li‘)15 if(moren.length==0){16 alert("我是空的~没戏")17 }18 }19 })先声明 选项卡的头部就叫头部
选项卡的内容就叫内容啊~
想到的第一种方法(笨方法)：
绑定添加了click事件。当切换头部的时候执行.头部根据自己的索引获得相对应的内容，在遍历到内容下的li元素，就获得每个头部相对应的内容下的总个数。
因为说，这是click事情后发现的事，但是忽略了头部的第一个元素，我要它在浏览器的刷新的时候就开始执行，所以我为头部的第一个元素增加多了一个class类 在对这个class类进行判断。最后~
就得到我想要的效果。当个数==0||!==0的时候就执行我所要的。
但是考虑到。后面可能会出现一切我所预料不到的事，我不要它在我点击的时候在执行，我要在浏览器刷新后加载后就帮我执行。所以小菜鸟我又苦逼的凑出一种方法
另外的一种方法 感觉这样比较好~:
1 $(function(){ 2 $(".bao").hide(); 3 $(".bao").eq(0).show(); 4 $(".head li").click(function(){ 5 $(this).addClass(‘cur‘).siblings().removeClass("cur"); 6 $(".bao").eq($(this).index()).show().siblings(".bao").hide() 7 }); 8 9 var aaa= $(".bao ul")10 aaa.each(function(){11 var b=$(this).children(‘li‘).length12 alert(b)13 if(b==0){14 $(this).append("<div>我是0个之后增加上去的</div>")15 }16 })17 })
这种方法用了$.each()
比较方便吧，目前来说得到我想要的结果。$.each()遍历出每个内容元素，然后在获取内容自己下面的li元素的总数 就可以判断后得到我想要的效果
。。恩啊~分享到这里~~我是菜鸟，轻拍~
【JQ成长笔记】关于$(this).index与$.each的使用
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。