jquery - 通過點擊切換文字內容


今天要寫一個簡單的顯示/隱藏效果,本以為是挺簡單的事兒,沒想到還真因為基本功不扎實遇到了問題,這里跟大家分享一下。

百度了很多方法,精簡能用的干貨實在太少,最后還是通過去查jq的官方api才找到了解決問題的方法。

簡單講就是通過jq的toggle方法分別寫兩個點擊事件。

 1 <html>
 2 <head>
 3 <title>jquery - 通過點擊切換文字</title>
 4 <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
 5 </head>
 6 <script>
 7 $(document).ready(function(){
 8     $(".dj").toggle(function(){
 9         $(".info_main").show();
10         $(".dj").text("-")},
11     function(){
12         $(".info_main").hide();
13         $(".dj").text("+")}
14     );
15 });
16 </script>
17 <body>
18 <div class="info_tit">展開:<span class="dj">+</span></div>
19     <div class="info_main" style="display:none">
20         隱藏內容。
21     </div>
22 </body>
23 </html>

這樣一來就清爽很多啦。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM