jQuery Mobile中的超链接

　　jQuery Mobile中的超链接

　　假设在我们的导航栏有5个按钮，如果我们这样写按钮的链接：

<a id="gg" href="gg.html"><img src="images/gg.png" /><br />公告</a></span>

　　那么在实际运行时，点击这个链接，会出现错误提示：“Error Loading Page”，即页面加载错误。

　　错误原因是jQuery Mobile中，使用ajax加载页面，原理跟超链接不同。如果我们还想要使用超链接，可以在超链接上加属性：

　　rel="external"或者data-ajax="false"

　　下面是会议室页面（hys.html）的导航栏：

  <div data-role="footer" data-position="fixed" data-theme="c">
    <div data-role="navbar">
      <ul>
        <li><a id="gg" href="gg.html" rel="external"><img src="images/gg.png" /><br />公告</a></li>
        <li><a id="sp" href="sp.html" rel="external"><img src="images/sp.png" /><br />审批</a></li>
        <li><a id="qd" href="qd.html" rel="external"><img src="images/qd.png" /><br />签到</a></li>
        <li><a id="hys" href="hys.html" rel="external"><img src="images/hys.png" /><br />会议室</a></li>
        <li><a id="grxx" href="grxx.html" rel="external" class="ui-btn-active ui-state-persist"><img src="images/grxx.png" /><br />个人信息</a></li>
      </ul>
    </div>

　　还有个人信息页面（grxx.html）的导航栏：

  <div data-role="footer" data-position="fixed" data-theme="c">
    <div data-role="navbar">
      <ul>
        <li><a id="gg" href="gg.html" rel="external"><img src="images/gg.png" /><br />公告</a></li>
        <li><a id="sp" href="sp.html" rel="external"><img src="images/sp.png" /><br />审批</a></li>
        <li><a id="qd" href="qd.html" rel="external"><img src="images/qd.png" /><br />签到</a></li>
        <li><a id="hys" href="hys.html" rel="external" class="ui-btn-active ui-state-persist"><img src="images/hys.png" /><br />会议室</a></li>
        <li><a id="grxx" href="grxx.html" rel="external"><img src="images/grxx.png" /><br />个人信息</a></li>
      </ul>
    </div>
  </div>

　　注意到，每个超链接都加上了rel="external"表示这个是外部链接，不使用ajax。