ons-tabbar hide with jQuery

Я использую onsen с ons-tabbar и хочу скрыть/показать вкладки с jquery. Я хочу скрыть вкладки на странице входа и показать после входа в систему. Это мой код:ons-tabbar hide with jQuery

<head> 
    <meta charset="utf-8"> 

    <script src="http://debug-software.intel.com/target/target-script-min.js#h2kN-2HmemNy-2C0zFMFsSdJyBtr__GRx6CB-TI6nsA"></script> 
    <link rel="stylesheet" href="css/onsenui.css"> 
    <link rel="stylesheet" href="css/onsen-css-components-blue-basic-theme.css"> 
    <link rel="stylesheet" href="css/login.css"> 

    <script src="js/SQLitePlugin.js"></script> 
    <script src="js/angular/angular.js"></script> 
    <script src="js/onsenui.js"></script> 
    <script src="js/jquery-1.11.3.min.js"></script> 

    <script> 
     ons.bootstrap(); 
     //tabMenu.hideTabs = true; 

     function OnIngresar() { 
      tabMenu.hideTabs = false; 
     } 
    </script> 
</head> 

<body> 
    <ons-tabbar var="tabMenu" id="tabMenu"> 
     <ons-tab page="pagIngreso" active="true"> 
      <ons-icon icon="star"></ons-icon> 
     </ons-tab> 

     <ons-tab page="pagNovedades"> 
      <ons-icon icon="comment"></ons-icon> 
     </ons-tab> 

     <ons-tab> 
      <ons-icon icon="circle"></ons-icon> 
     </ons-tab> 

    </ons-tabbar> 

    <ons-template id="pagIngreso"> 
     <ons-page id="pagLogin"> 
      <ons-toolbar fixed-style> 
       <div class="center">Ingreso</div> 
      </ons-toolbar> 

      <div class="login-form"> 
       <input type="email" class="text-input--underbar" placeholder="Email" value=""> 
       <br> 
       <br> 
       <ons-button modifier="large" class="login-button" onclick="OnIngresar();">Ingresar</ons-button> 
      </div> 
     </ons-page> 

    </ons-template> 

    <ons-template id="pagNovedades"> 
     <ons-page> 
      <ons-toolbar fixed-style> 
       <div class="center">Novedades</div> 
      </ons-toolbar> 
     </ons-page> 
    </ons-template> 

</body> 

</html>

Но когда я нажмите кнопку "Ingresar" ничего не happends, как я могу сделать?

источник

2015-05-12 mneu

Почему вы не просто поставить первый в с логином и потом перейти к TabBar? –

Привет !, вы можете привести пример ?, спасибо! – mneu

Я думаю, что нет необходимости скрывать табуляцию в вашей ситуации. Как я уже говорил в предыдущем комментарии, простое решение, чтобы показать первую нормальную страницу с логином и затем перейдите к основному приложению (с TabBar) на логин успеха:

<ons-navigator var="nav" page="login.html"></ons-navigator> 

<ons-template id="login.html"> 
    <ons-page> 
    <ons-toolbar> <div class="center">Login page</div></ons-toolbar> 
    Login form here... 
    <ons-button onclick="doLogin();">Login</ons-button> 
    </ons-page> 
</ons-template> 

<ons-template id="app.html"> 
    <ons-page> 
     <ons-toolbar> <div class="center">My app</div></ons-toolbar> 
     <ons-tabbar> 
      tabs here... 
     </ons-tabbar> 
    </ons-page> 
</ons-template>

Тогда логин и перейти к Основная программа:

function doLogin() { 
    console.log('login...'); 

    // On success 
    nav.resetToPage('app.html'); 
}

Пример здесь: http://codepen.io/frankdiox/pen/eNmNoz

источник

2015-05-18 03:51:44

Спасибо! Отлично работает! – mneu

ons-tabbar hide with jQuery

ответ

Смежные вопросы