table中tr使用toggle不好，选择换一张方式
生活随笔
收集整理的這篇文章主要介紹了
table中tr使用toggle不好，选择换一张方式
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
? ? ? 好幾次遇到的問(wèn)題，都是table中tr后面有一部分內(nèi)容要顯示，也是用tr裝的，但是需要點(diǎn)擊該行，后面那個(gè)tr才顯示出來(lái)。不過(guò)最好不要用toggle去寫(xiě)，因?yàn)橹鴮?shí)效果不佳。故而建議換一種方式，也許最簡(jiǎn)單的js才是最有效的。
? ? ?
<html xmlns="http://www.w3.org/1999/xhtml" > <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"/> <title>jquery toggle 顯示與隱藏表格行_http://www.jbxue.com</title> <script src="仿淘寶/js/jquery-1.10.2.min.js"></script> <style type="text/css"> .hidden{ display:none; } .button{ cursor:hand; } </style> </head> <body> <h3>表格行的顯示與隱藏（點(diǎn)擊第一行或第二行出現(xiàn)內(nèi)容）</h3> <table><tr class="button" id="tr_1"><td>第一行</td></tr><tr id="tabtr_1" class="hidden"><td>1111111111腳本學(xué)堂，是專(zhuān)業(yè)的腳本編程，網(wǎng)站編程，系統(tǒng)管理，服務(wù)器管理，軟件教程，硬件教程等技術(shù)站點(diǎn)。歡迎大家的光臨。</td></tr><tr class="button" id="tr_2"><td>第二行</td></tr><tr id="tabtr_2" class="hidden"><td>2222222222腳本學(xué)堂，是專(zhuān)業(yè)的腳本編程，網(wǎng)站編程，系統(tǒng)管理，服務(wù)器管理，軟件教程，硬件教程等技術(shù)站點(diǎn)。歡迎大家的光臨。</td></tr> </table/> </body> </html><script type="text/javascript">$(function(){$(".button").click(function(){if(!$('#tab'+this.id).hasClass("hidden")){$('#tab'+this.id).addClass('hidden');}else{$('tr[id^=tab]').addClass('hidden');$('#tab'+this.id).removeClass('hidden');}}); }); </script>?
? ??
轉(zhuǎn)載于:https://www.cnblogs.com/wanliyuan/p/3799005.html
總結(jié)
以上是生活随笔為你收集整理的table中tr使用toggle不好，选择换一张方式的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： scjp考试准备 - 4 - 关于数组
- 下一篇： 源码编译安装mysql，DDL数据定义语