如何在Tolito進度條完成時執行jQuery函數？

我使用Tolito Progress Bar 1.0.2 https://github.com/tolis-e/jQuery-Mobile-Progress-Bar-with-Percentage在我的jQuery Mobile應用程序中顯示帶百分比計數器的進度條。如何在Tolito進度條完成時執行jQuery函數？

我想在Tolito進度條完成時顯示一個按鈕，我該怎麼做？

來源

2013-04-04 Alexander

一旦進度條完成，就會觸發一個事件。因此您可以附加一個事件處理程序。

下面是一個例子，說明如何做到這一點。

<!DOCTYPE html> 
<html> 

    <head> 
     <title>Tolito Progress Bar for jQuery Mobile</title> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" /> 
     <link rel="stylesheet" type="text/css" href="../src/css/tolito-1.0.3.css" /> 
     <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
     <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script> 
     <script type="text/javascript" src="../src/js/tolito-1.0.3.js"></script> 
     <script> 

      $(document) 
       .on('pageinit', "#home-page", function() { 

       var tolito = TolitoProgressBar('progressbar') 
        .setOuterTheme('b') 
        .setInnerTheme('e') 
        .isMini(true) 
        .setMax(100) 
        .setStartFrom(0) 
        .setInterval(10) 
        .showCounter(true) 
        .logOptions() 
        .build() 
        .run(); 
      }); 

      $(document) 
       .on('complete', '#progressbar', function() { 
       $('#msg').parent().find('.ui-btn-inner .ui-btn-text').text('Completed'); 
      }); 
     </script> 
    </head> 

    <body> 
     <!-- /page --> 
     <div data-role="page" id="home-page"> 
      <!-- /header --> 
      <div data-role="header" data-theme="c"> 
       <h1>Tolito Progress Bar for jQuery Mobile</h1> 

      </div> 
      <!-- /content --> 
      <div data-role="content"> 
       <div id="progressbar"></div> 
       <input type="button" id="msg" value="In Progress"/> 
      </div> 
     </div> 
    </body> 

</html>

我希望有幫助。

來源

2013-04-06 09:12:38

如何在Tolito進度條完成時執行jQuery函數？

回答

相關問題