+ -
当前位置:首页 → 问答吧 → 帮忙看看这个用gt,lt区间选择有什么错,谢谢

帮忙看看这个用gt,lt区间选择有什么错,谢谢

时间:2010-06-10

来源:互联网

复制代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  5. <title>Jquery</title>
  6. <script type="text/javascript" src="js/jquery-1.4.2.js"></script>
  7. <style type="text/css">
  8. #prd{width:250px; display:block;}
  9. #prd li {
  10.     display: block;
  11.     list-style: none;
  12.     float: left;
  13.     width: 100px;
  14.     height: 22px;
  15.     margin: 5px 5px;
  16.     padding: 0px;
  17.     line-height: 22px;
  18.     text-align: center;
  19.     border:1px solid #333
  20. }
  21. .butbar{ clear:both; text-align:center;}
  22. .but{display:block; width:100px; line-height:22px; border:1px solid #E69; text-align:center; float:left; margin:0px 5px;}
  23. </style>
  24. </head>
  25. <body>
  26. <p>显示和隐藏</p>
  27. <ul id="prd">
  28.     <li>加能</li>
  29.     <li>sony</li>
  30.     <li>加能</li>
  31.     <li>sony</li>
  32.     <li>加能</li>
  33.     <li>sony</li>
  34.     <li>富士康</li>
  35.     <li>HP</li>
  36.     <li>ASUS</li>
  37.     <li>联想</li>
  38.     <li>山力</li>
  39.     <li>其它</li>
  40. </ul>
  41. <div class="butbar">
  42. <a href="moth.htm" class="but" >高级显示</a>
  43. </div>
  44. <script type="text/javascript">
  45. $(document).ready(function(){
  46.     $prdMore = $('li:gt(2):lt(5)');
  47.     $prdMore.css("background","#f61");
  48.         
  49. });
  50. </script>
  51. </body>
  52. </html>



选择出来的结果竟然是这个,,,真是怪事了,有谁能帮忙解释一下为什么不是3/4两个,却是3-7吗

[ 此帖被askswin在2010-06-10 17:39重新编辑 ]
图片:
这个是由于你的  $prdMore = $('li:gt(2):lt(5)');  中 li:gt(2)是在所有的li中选的。而:lt(5)是在你选出的>2的结果中选的。如果要只选出3,4的话。正确的写法是    $prdMore = $('li:gt(2):lt(2)');

作者: askswin   发布时间: 2010-06-10