jq 版的tab切换

时间:2022-06-19 06:18:25

ta切换是在前端中非常常见的一种效果,网上的效果很多。但是我觉得下面这种方法最好,把tab效果封装成一个函数 tabs,这个函数要配合jq使用。

var tabs = function (tab, con) {
tab.click(function () {
var index = tab.index(this);
tab.removeClass('active');
$(this).addClass('active');
con.hide();
con.eq(index).show();
})
}; 下面是调用这个函数。
tabs($("#tab-li li"), $('#tab-content .main'));

函数里面的active是tab导航栏中需要变话的样式。