1. 程式人生 > >mui的選項卡js選中指定項

mui的選項卡js選中指定項

close ansi body 技術 -a control gpo tez indicator

dom結構:在一定條件下想默認選中第二個選項卡

技術分享圖片
<div id="segmentedControl" class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-negative addressslider" style="border-bottom:1px solid #CCC;">
     <a class="mui-control-item mui-active" href="#item1">
        選擇地址
     </a>
     <
a class="mui-control-item" href="#item2" id="header2"> 新增地址 </a> </div> <div id="item1" class="mui-control-content mui-active" style="height:320px;"> <div class="mui-scroll-wrapper"> <div class="mui-scroll"> 第二個選項卡,有滾動 </
div> <!--<div class="mui-scrollbar mui-scrollbar-vertical" style="transition-duration: 500ms; opacity: 0;"><div class="mui-scrollbar-indicator" style="transition-duration: 0ms; display: block; height: 25px; transform: translate3d(0px, 0px, 0px) translateZ(0px); transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);"></div></div>
--> </div> </div> <div id="item2" class="mui-control-content" style="height:320px;"> 第二個選項卡 </div>
View Code

親測可用


//模擬第二個選項卡點擊
mui.trigger(document.getElementById("header2"),‘touchstart‘);
mui.trigger(document.getElementById("header2"),‘tap‘);

註意:

mui.trigger 第一個參數應該是dom對象,如果用jq需要轉換成dom

依次觸發touchstart tap兩個事件才可以

mui的選項卡js選中指定項