jqurey ul 的问题

Question

$(function() {
var element= $(".suits").eq(0);
var x=element.find(".list-h > li").length;
var z=element.find(".list-h > li").width();
var w=(460);
element.eq(0).css({
"overflow-x":(x*z>w)?"scroll":"hidden"
});
element.find("ul").eq(0).css({
"width":x*z
});
}
)
各位达人，请问一下 我为什么无法选中第二个ul呢？只有第一个ul有属性
前台页面是 <div class="mc tabcon hide" id="suit" style="display: block;">
<!--begin-->
<div id="tab5_con1" class="dis">
 <div class="tabcon-sub" style="display: block;">
  <div class="master">
<div class="p-img"><a target="_blank" href="goods.php?id=22590"><img width="100" height="100" src=""></a></div>
<div class="p-name"><a target="_blank" href="goods.php?id=22590">三诺（3NOD）N－35G 标准版s</a></div>
<div class="icon-add"></div>
  </div>
  <div style="" class="suits" id="suits-0">
<ul class="list-h" style="">

  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  </ul>
 </div>
  <div class="i-suit"><b></b></div>
  <div class="infos">
<div class="p-name">至尊礼包</div>
<div class="p-price">套装价：<strong>￥1333799.00元</strong></div>
<div class="p-et">原价：<del>￥6785.00</del></div>
<div class="p-saving">立即节省：￥1799.00元</div>
<div class="btns"><a class="btn-buy" href="javascript:void(0);" onClick="javascript:addToCart();">购买套装</a></div>
  </div>
</div>
</div>
<!--end-->
<!--begin-->
<div id="tab5_con2" class="undis">
 <div class="tabcon-sub" style="display: block;">
  <div class="master">
<div class="p-img"><a target="_blank" href="goods.php?id=22590"><img width="100" height="100" src=""></a></div>
<div class="p-name"><a target="_blank" href="goods.php?id=22590">三诺（3NOD）N－35G 标准版s</a></div>
<div class="icon-add"></div>
  </div>
  <div id="suits-0" class="suits" style="">
<ul class="list-h" style="">
 <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>   </ul>
</div>
  <div class="i-suit"><b></b></div>
  <div class="infos">
<div class="p-name">超级礼包</div>
<div class="p-price">套装价：<strong>￥1799.00元</strong></div>
<div class="p-et">原价：<del>￥6785.00</del></div> <div class="p-saving">立即节省：￥1722299.00元</div>
<div class="btns"><a class="btn-buy" href="javascript:void(0);" onClick="javascript:addToCart();">购买套装</a></div>
  </div>
</div>
</div>
<!--end-->
<!--begin-->
<div id="tab5_con3" class="undis">
 <div class="tabcon-sub" style="display: block;">
  <div class="master">
<div class="p-img"><a target="_blank" href="goods.php?id=22590"><img width="100" height="100" src=""></a></div>
<div class="p-name"><a target="_blank" href="goods.php?id=22590">三诺（3NOD）N－35G 标准版s</a></div>
<div class="icon-add"></div>
  </div>
  <div id="suits-0" class="suits" style="">
<ul class="list-h" style="">
 <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  <li>
<div class="p-img"><a href="goods.php?id=22089" target="_blank"><img height="100" width="100" src="/piclist/2418/ced241d1-7f59-40e9-8368-dc719b59211e.jpg"></a></div>
<div class="p-name"><a href="goods.php?id=22089" target="_blank">漫步者（edifier）R151T多媒体有源音箱 中级5.1系列</a></div>
  </li>
  </ul>
</div>
  <div class="i-suit"><b></b></div>
  <div class="infos">
<div class="p-name"></div>
<div class="p-price">套装价：<strong>￥1791119.00元</strong></div>
<div class="p-et">原价：<del>￥6785.00</del></div> <div class="p-saving">立即节省：￥1799.00元</div>
<div class="btns"><a class="btn-buy" href="javascript:void(0);" onClick="javascript:addToCart();">购买套装</a></div>
  </div>
</div>
</div>
<!--end-->

      </div>
谢谢各位了 帮忙看看啊

Answer 1

实现的效果是当计算出<ul class="list-h" style="">这个ul的宽度，并且判断当宽度大于460时，
  <div id="suits-0" class="suits" style="">的样式是overflow-x:scroll;现在这段代码只会在第一个div上起作用，第二个div就不行了，是不是我没选择好。还是怎么养？我不懂啊 
                                        

Answer 2

var element= $(".suits").eq(0);
是不是这段的原因 eq(0) 就只选择了第一个。

Answer 3

var element= $(".suits");
就这样 ，你试试 。

Answer 4

把eq(0)去掉的话 所有的ul的宽度都一样了

Answer 5

这样的话 所有的ul的宽度都一样了，没区分开，因为ul下的li的数量不一样，宽度应该是不一样啊~

Answer 6

$(function() {
//    var element= $(".suits").eq(0);
//    var x=element.find(".list-h > li").length;
//    var z=element.find(".list-h > li").width();
//    var w=(460);
//    element.eq(0).css({
//        "overflow-x":(x*z>w)?"scroll":"hidden"
//    });
//    element.find("ul").eq(0).css({
//        "width":x*z
//    });
    var element= $(".suits");
    $(element).each(function(){
        var x=$(this).find(".list-h > li").length;
        var z=$(this).find(".list-h > li").width();
        var w=(460);
        $(this).eq(0).css({
        "overflow-x":(x*z>w)?"scroll":"hidden"
        });
        $(this).find("ul").eq(0).css({
        "width":x*z
        });
    })
})试下这段代码 。
你是要下面的suits跟第一个一样的出现横向滚动条吗 ？

Answer 7

隐藏的层用jquery怎么取他的宽度？

Answer 8

别的都搞定了，就是涉及到切换，把其他的层隐藏了，jqurey就取不到他的宽度了~

Answer 9

$(":hidden");//不可见的元素 。
.width();//宽度 。

Answer 10

貌似搞定了 贴一下代码 谢谢各位了
 $(function() { $("div.suits").each(function(){
      var x=$(this).find(".list-h > li").length;
    var z=$(this).find(".list-h > li").width();
;     var w= 460;
    $(this).css({
     "overflow-x":(x*z>w)?"scroll":"hidden"
    });
$(this).find("ul").css({
"width":x*z
});   });
  
   
})$(function() { $(".undiss").addClass("undis");
 $(".undiss").removeClass("undiss");
 
 })

Answer 11

var element= $(".suits").eq(0); 这句话就只取了第一个ul