星空网 > 软件开发 > Java

jQuery实现隐藏标签

要求:用户进入该页面时,品牌列表默认是精简显示,用户可以单击商品列表下方的“显示全部品牌”按钮来显示全部的品牌。

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %><!DOCTYPE html><html><head runat="server">  <meta name="viewport" content="width=device-width" />  <script src='/images/loading.gif' data-original="../../Scripts/jquery-2.2.3.js"></script>  <title>Index</title></head><body>  <div class="SubCategoryBox">    <ul>      <li><a href="#">佳能</a></li>      <li><a href="#">索尼</a></li>      <li><a href="#">三星</a></li>      <li><a href="#">尼康</a></li>      <li><a href="#">松下</a></li>      <li><a href="#">卡西欧</a></li>      <li><a href="#">富士</a></li>      <li><a href="#">柯达</a></li>      <li><a href="#">宾得</a></li>      <li><a href="#">理光</a></li>      <li><a href="#">奥林巴斯</a></li>      <li><a href="#">明基</a></li>      <li><a href="#">爱国者</a></li>      <li><a href="#">其他品牌相机</a></li>    </ul>    <div class="showmore">      <a href="#" id="C"><span>显示全部品牌</span></a>    </div>  </div>  <script>    var p = $("ul li:gt(7)");    p.hide();    $("#C").click(function(){      var q;      if(p.is(":visible")){        p.hide();        q=$(this).find('span').text("精简显示品牌");      } else {        p.show();                q=$(this).find('span').text('显示全部品牌');      }    });  </script></body></html>

显示效果:

jQuery实现隐藏标签

jQuery实现隐藏标签




原标题:jQuery实现隐藏标签

关键词:jquery

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

tiktok带货达人:https://www.goluckyvip.com/tag/82546.html
tiktok不用登录也能看的版本:https://www.goluckyvip.com/tag/82547.html
tiktok破解国内可用:https://www.goluckyvip.com/tag/82548.html
tiktok代入驻:https://www.goluckyvip.com/tag/82549.html
互联网销售税:https://www.goluckyvip.com/tag/8255.html
tiktok的禁令:https://www.goluckyvip.com/tag/82550.html
23点聊电商:新质生产力加速数字贸易发展 卓尔智联集团实现营收利润双增长 :https://www.kjdsnews.com/a/1836411.html
南京浦口都有什么好玩的地方 南京浦口都有什么好玩的地方推荐:https://www.vstour.cn/a/363180.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流