toggle默认不显示问题

第一，jquery.1.11.2.js,jquery从1.9开始就不再支持toggle方法了。你可以试试把你引用jquery的地方删除，换成下面的。

1	script src= "http://libs.baidu.com/jquery/1.8.3/jquery.min.js" ></script>

第二，写反了执行动作。

1 2 3 4 5 6 7 8 9 10 11

$toggleBtn.toggle( function (){                      $category.show(); //隐藏选中元素                      $( ".showmore" ).css( "background" , 'url("images/down.gif") no-repeat 0 0 ' );                      $( ".showmore span" ).text( '显示全部品牌' ); //修改span的样式和文本                      $( 'ul li' ).removeClass( "promoted" );                      }, function (){                      $category.hide(); //显示隐藏了的li                      $( ".showmore" ).css( "background" , 'url("images/up.gif") no-repeat 0 0 ' );                      $( ".showmore span" ).text( '精简显示品牌' ); //修改span的样式和文本                      $( "ul li" ).filter( ":contains('佳能'),:contains('尼康'),:contains('奥林巴斯')" ).addClass( "promoted" ); //为选中的li增加promoted样式              });

你默认已经隐藏了，所以第一次执行的时候应该先show(),再hide().

另外你在引用jquery的时候引用一个就可以了，有个.min.js的是压缩版，内容是一样的，最好用压缩版，网页加载更快。

你是在看《锋利的jquery》吧。那上面的所以js代码都是基于1.9以下的，要多注意。我也是看那个书学的，写得很好。