希望大家講講用js或jquery的例子,不要用vue等框架
抱歉沒(méi)有說(shuō)清楚,我的意思是用數(shù)據(jù)來(lái)驅(qū)動(dòng)Ui的更新,而不是一邊要更新數(shù)據(jù),一遍還要跟新UI,像下面的例子
var tabSwitch = (function(){
var lastIndex = 0;
return function(){
// 點(diǎn)擊tab導(dǎo)航,觸發(fā)tab切換事件
$('.oa-tab').on("click", ".oa-tab-nav", function(e){
var index = $(this).index();
$(".oa-tab").trigger("tab.switch", index);
});
$(".oa-tab").on("tab.switch", function(e, index){
// 更新tab導(dǎo)航
$(".oa-tab-nav").eq(lastIndex).removeClass('active');
$(".oa-tab-nav").eq(index).addClass('active');
// 更新tab內(nèi)容
$(".oa-tab-item").eq(lastIndex).removeClass('active');
$(".oa-tab-item").eq(index).addClass('active');
lastIndex = index;
});
// 初始化觸發(fā)
$(".oa-tab").trigger("tab.switch", 0);
};
})();
tabSwitch();
人生最曼妙的風(fēng)景,竟是內(nèi)心的淡定與從容!
樓主說(shuō)的顯示區(qū)域只有一個(gè),只是根據(jù)上面的選項(xiàng)來(lái)重新產(chǎn)生載入資料在該顯示區(qū)域?如果是這樣子的話,其實(shí)就是點(diǎn)擊選項(xiàng)的時(shí)候,先清空顯示區(qū)域,再呼叫對(duì)應(yīng)的資料並產(chǎn)生對(duì)應(yīng)的樣子然後加入到該顯示區(qū)域就可以了
數(shù)據(jù)驅(qū)動(dòng)?你的意思是點(diǎn)選tab的時(shí)候動(dòng)態(tài)ajax請(qǐng)求資料?