javascript - 如何用數(shù)據(jù)驅動的方式寫tab選項卡?
問題描述
希望大家講講用js或者jquery的例子,不要用vue等框架
抱歉沒有說清楚,我的意思是用數(shù)據(jù)來驅動Ui的更新,而不是一邊要更新數(shù)據(jù),一遍還要跟新UI,像下面的例子
var tabSwitch = (function(){var lastIndex = 0;return function(){ // 點擊tab導航,觸發(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導航$('.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)用對應的數(shù)據(jù)并生成對應的樣子然后添加到該顯示區(qū)域就可以了
回答2:數(shù)據(jù)驅動?你的意思是點擊tab的時候動態(tài)ajax請求數(shù)據(jù)?
相關文章:
1. python文檔怎么查看?2. python - pycharm 自動刪除行尾空格3. 安全性測試 - nodejs中如何防m(xù)ySQL注入4. python - pandas按照列A和列B分組,將列C求平均數(shù),怎樣才能生成一個列A,B,C的dataframe5. python - Pycharm的Debug用不了6. html - eclipse 標簽錯誤7. python 利用subprocess庫調(diào)用mplayer時發(fā)生錯誤8. 請問PHPstudy中的數(shù)據(jù)庫如何創(chuàng)建索引9. datetime - Python如何獲取當前時間10. javascript - 有適合開發(fā)手機端Html5網(wǎng)頁小游戲的前端框架嗎?
