javascript - 如何用數(shù)據(jù)驅(qū)動的方式寫tab選項卡?
問題描述
希望大家講講用js或者jquery的例子,不要用vue等框架
抱歉沒有說清楚,我的意思是用數(shù)據(jù)來驅(qū)動Ui的更新,而不是一邊要更新數(shù)據(jù),一遍還要跟新UI,像下面的例子
var tabSwitch = (function(){var lastIndex = 0;return function(){ // 點擊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();
問題解答
回答1:樓主說的顯示區(qū)域只有一個,只是根據(jù)上面的選項來重新生成加載數(shù)據(jù)在該顯示區(qū)域?如果是這樣子的話,其實就是點擊選項的時候,先清空顯示區(qū)域,再調(diào)用對應(yīng)的數(shù)據(jù)并生成對應(yīng)的樣子然后添加到該顯示區(qū)域就可以了
回答2:數(shù)據(jù)驅(qū)動?你的意思是點擊tab的時候動態(tài)ajax請求數(shù)據(jù)?
相關(guān)文章:
1. android - 使用百度sdk調(diào)用SDKInitializer.initialize(this)時報錯?2. javascript - 最近用echarts做統(tǒng)計圖時遇到兩個問題!!3. 淺談Vue使用Cascader級聯(lián)選擇器數(shù)據(jù)回顯中的坑4. html5 - 用h5本地存儲是否安全?5. 基于Spring MVC Java的配置無法正常工作控制臺顯示無錯誤,但我的jsp頁面未顯示6. javascript - webpack-dev-server和webpack沖突嗎7. javascript - react熱加載的一段代碼8. android - 優(yōu)酷的安卓及蘋果app還在使用flash技術(shù)嗎?9. 微信公眾號在線生成二維碼帶參數(shù)怎么搞?10. myeclipse中修改了javaweb的web.xml文件,為什么有時候會自動重新部署生效,有時就不會自動呢?

網(wǎng)公網(wǎng)安備