Heim > Backend-Entwicklung > PHP-Tutorial > 求高手,切换按钮tab2的背景怎么保持不再变回去?

求高手,切换按钮tab2的背景怎么保持不再变回去?

WBOY
Freigeben: 2016-06-23 14:07:49
Original
953 Leute haben es durchsucht

我的问题是,页面里有tab1和tab2两个按钮, 可以点击切换背景。
 
切换代码如下
 


         Tab1
         Tab2
         

                 
内容1111111111内容111111111

                 
内容2222222222内容2222222222

         

 

 但是每次点tab2的时候,tab2背景变绿色,完事页面就要刷新一次,下面的内容背景tab2的内容,但是按钮的背景绿色又回到了tab1.现在想实现点tab2 以后,tab2的背景是绿色,应该怎么实现,求高手知道
 
附:
 js代码如下:
 <script></script>
 <script> <br /> $(function(){ <br /> $(".tabtext div").hide(); <br /> $(".tabtext div:first").show(); <br /> $(".tabmenu a").click(function(){ <br /> $(this).addClass("curr").siblings().removeClass("curr"); <br /> $(".tabtext div").hide(); <br /> var tt = $(this).attr("href"); <br /> $(tt).show(); <br /> }); <br /> }); <br /> </script>
 

样式为:
 *{ margin:0; padding:0;}
 .tabmenu { width:500px; margin:20px auto; }
 .tabmenu a{ display:inline-block; width:100px; height:35px; line-height:35px; text-align:center; color:#000; background:#ccc; }
 .tabmenu a.curr { background:#080; color:#fff; font-weight:bold; }
 .tabtext {width:480px; height:170px; padding:10px; font-size:20px;} 


回复讨论(解决方案)

jq不会写,呵呵,i m old school

这种乒乓键的处理原理就是设定一个bool变量记录状态
初始值false,当按下就是true,再按一下变回false……
然后每次事件都判断这个状态给背景(或其他参数)复制

这样的处理放之四海而皆准,适用于各种语言、各种判断按下/弹起引起变动的参数

求代码,谢谢高手

我靠 你思路错了   这种不要给真的连接   用一个tag 插件  选项卡 上面 的连接 直接 href="javascript:void(0)"  阻止跳转   用那个tag插件  你对应的内容会在两个 class直接切换 你的选项卡也会在两个class直接切换   你那个跳转了 页面就重新请求了 肯定是搞不成的啊

给你思路
一种是用选项卡,点击后不跳转,在两个选项卡间切换,这种用JS实现,页面不刷新。
第二种是点击后页面跳转,页面刷新,用URL传参来判断,那么按钮的颜色不要用JS控制,也用参数判断显示。

求具体代码 php的

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage