基於jquery庫的tab新形式使用_jquery

複製程式碼程式碼如下：

> >


$(document).ready(function(){
$("ul.menu li:first-child").addClass("current");
$("div.content"). find(" div.layout:not(:first-child)").hide();
$("div.content div.layout").attr("id", function(){return idNumber("否") $("div.content div.layout").index(this)});
$("ul.menu li").click(function(){
var c = $(" ul.menu li");
var index = c.index(this);
var p = idNumber("No");
show(c,index,p);
}) ;

function show(controlMenu,num,prefix){
var content= prefix num;
$('#' content).siblings().hide(); '#' content).show( );
controlMenu.eq(num).addClass("current").siblings().removeClass("current");

函數idNumber(prefix){
var idNum = prefix;
return idNum;
});
腳本>

* {利潤：0;填充：0}
ul， li {
列表樣式：無
}
.box {
邊框：1pxsolid #ccc;
邊距：10px;
}
.tagMenu {
高度🎜>高度：24px;
位置：親屬；
邊框底部：1px實心#999
}
.tagMenu ul {
位置：絕對；
底部：-1px； ：26px;
}
ul.menu li {
float:left;
左邊框：1px實心#999;
內邊距：0 12px;
遊標：指針
}
ul.menu li.current {
邊框：1pxsolid #999;
邊框底部：無;
背景：#fff;
高度：25px；
高：26px;
邊距：0
}
.content { padding:10px}
;

• 標籤1.1


• 標籤1.2


• 標籤1.3


• 標籤1.4

訊息1.1

訊息1.2

訊息1.3

訊息1.4

身體>