2014-06-21 118 views
0

我似乎無法讓導航欄小部件在我的代碼中工作。我正在用記事本++編寫我的第一個應用程序,我正在努力學習,所以我爲任何簡單的錯誤而道歉。jQuery Mobile導航欄不起作用

截至目前,它顯示爲兩個2行表,第一個顯示第一個按鈕,下面有一個空格,第二個顯示第二個按鈕下面的空間。我已經檢查了jQuery移動演示網站,試圖找出代碼並提出了注意事項,所以我來找你。

<div data-role="page" id="pageone"> 
<div data-role="header" data-id="header" data-position="fixed"> 
    <div data-role="navbar"> 
     <ul> 
      <li><a href="#pagetwo" class ="ui-btn-active ui-state-persist"> 
       <h2>Summoner Information</h2> 
       <h3>Statistics & Achievements</h3><a/></li> 
      <li><a href="#todolist"> 
       <h2>To-Do List</h2> 
       <h3>Application wish list</h3></a></li> 
     </ul> 
    </div><!--/navbar --> 
</div><!--/header --> 
<div data-role="main" class="ui-content"> 
    <p>This is an ongoing test page for my League of Legends Statistical Analysis and Coaching application</p> 
    <p>Please enter your summoner name in the text box below.</p> 
    <h2>Enter Your Summoner Name</h2> 

    <div class="ui-grid-a"> 
     <div class="ui-block-a"><input type="search" name="SumName" id="SumName" placeholder="Summoner Name" data-clear-btn="true"></div> 
     <div class="ui-block-b"><a href="#pagetwo" id="callSum" class="ui-btn" >Search</a></div> 

    </div> 
</div> 
<div data-role="footer"> 
    <h1>Footer Text</h1> 

</div> 

回答

0

您關閉錨標記有語法錯誤。您已使用像<a/>而不是</a>

更新您的代碼,如下所示。

<li><a href="#pagetwo" class ="ui-btn-active ui-state-persist"> 
     <h2>Summoner Information</h2> 
     <h3>Statistics & Achievements</h3></a> 
    </li>