jQuery 모바일 네비게이션이 작동하지 않습니다.

Question

내 코드에서 네비게이션 위젯을 전혀 사용할 수없는 것 같습니다. 메모장에서 첫 번째 응용 프로그램을 만들고 있습니다. ++로 빌드 할 때 배우려고 노력 중이므로 간단한 실수가 있으면 사과드립니다.

현재 두 개의 행 테이블이 있는데 첫 번째에는 아래에 공백이있는 첫 번째 버튼이 표시되고 두 번째 행에는 두 번째 버튼이있는 두 번째 행 표가 있습니다. 나는 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> 

Answer 1

당신은 앵커의 닫기 태그에 구문 오류가 있습니다. </a> 대신 <a/>을 사용했습니다.

아래와 같이 코드를 업데이트하십시오.

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