jQuery实现判断li的个数从而实现其他功能
生活随笔
收集整理的這篇文章主要介紹了
jQuery实现判断li的个数从而实现其他功能
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
需求:當ul中的li大于6個的時候顯示圖片,當li小于6個的時候隱藏圖片,先來看看效果:
當有7個li的時候:
當有3個li的時候:
現在吧源碼放上來:
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><script src="jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script><style type="text/css">*{margin: 0px;padding: 0px;}.hidden_m{display: none;}#div1{width: 100%;height: 1000px;background: greenyellow;}#li_m_click{background: none;border:0px;}ul li{float: left;width: 150px;background: red;border: 1px solid black;list-style: none;}#div2{width: 25px;height: 25px;background: yellow;}</style></head><body><div id="div1"><ul><li>關鍵詞1</li><li>關鍵詞2</li><li>關鍵詞3</li><li id="li_m_click" ><div id="div2">圖</div></li></ul></div><script type="text/javascript">$(function(){$("#div2").hide();var count = ($("ul li").length)-1; //獲取所有的li的個數,去掉點擊的黑色的liif(count>6){$("#div2").show();alert('現在是大于6');}else{$("#div2").hide();alert('現在是小于6');}})</script></body> </html>總結
以上是生活随笔為你收集整理的jQuery实现判断li的个数从而实现其他功能的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 市调机构:到2024年全球5G智能手机渗
- 下一篇: mybatis+spring报错Prop