-1

我有一个包含 5 个<ul> <li>项目的列表视图（jquerymobile），如下所示 -

    <div class="ticketsBlock" data-theme="a">      
        <ul data-role="listview" data-inset="true">
 <li><a href="#custDetails" style="text-decoration:none" data-transition="slide"><p>John Smith</p><p>2 Cadeau Terr London ON N6K 4G1</p><br/><p>Issue with set-top box</p></a></li>
 <li><a href="#custDetails" style="text-decoration:none"><p>Sylvester Stallone</p><p>64 Faywood Dr Brampton ON L6Y 4L95</p><br/><p>New Connection</p></a></li>
 <li><a href="#custDetails" style="text-decoration:none"><p>Antenna Replacement</p><p>14 Grand St Brantford ON N3R 4B1</p><br/><p>New Connection</p></a></li>
 <li><a href="#custDetails" style="text-decoration:none"><p>Keanu Reaves</p><p>5617 Fourth Line Hillsburgh ON N0B 1Z0</p><br/><p>Distorted Display</p></a></li>
 <li><a href="#custDetails" style="text-decoration:none"><p>Tom Cruise</p><p>RR5 Perth ON K7H 3C7</p><br/><p>Issue with set-top box</p></a></li>
</ul>                
        </div>

每个中的 href<li>是指同一 HTML 页面中的 div 标签，其数据角色是“页面” -

<div data-role="page" id="custDetails" data-theme="a">
   <button class="ui-btn-left" id="backbutton" data-icon="arrow-l" data-iconpos="left">Back</button>
    <h1>XXX</h1>
    <button class="ui-btn-right" id="exit" data-icon="back" data-iconpos="right">Exit</button>
  <div data-role="content"> Content </div>
 <div data-role="footer" data-theme="a" class="ui-footer-fixed">
    <h4>myFooter</h4>
  </div>
</div>

根据 JQM 的标准，此 html 页面具有不同的 div-s，其数据角色为“页面”。现在，当我单击引用 div 的列表项（作为页面的数据角色）时，它不会导航到该 div。

但是，是的，如果我提供指向不同 HTML 页面的链接而不是同一 HTML 页面中的 div，它就可以工作。

任何人，请让我知道这种方法哪里有问题？这种方法会奏效吗？

4

1 回答 1

0

在这里工作正常演示http://jsfiddle.net/yeyene/ttjGv/2/

它转到那个div。检查下面的 html 标记。

<div data-role="page">
    <div id="my-header" data-role="header" data-position="fixed">            
            <h1>Page Title</h1>
        </div><!-- /header -->

        <div data-role="content">
            <div class="ticketsBlock" data-theme="a">      
        <ul data-role="listview" data-inset="true">
 <li><a href="#custDetails" style="text-decoration:none" data-transition="slide"><p>John Smith</p><p>2 Cadeau Terr London ON N6K 4G1</p><br/><p>Issue with set-top box</p></a></li>
 <li><a href="#custDetails" style="text-decoration:none"><p>Sylvester Stallone</p><p>64 Faywood Dr Brampton ON L6Y 4L95</p><br/><p>New Connection</p></a></li>
 <li><a href="#custDetails" style="text-decoration:none"><p>Antenna Replacement</p><p>14 Grand St Brantford ON N3R 4B1</p><br/><p>New Connection</p></a></li>
 <li><a href="#custDetails" style="text-decoration:none"><p>Keanu Reaves</p><p>5617 Fourth Line Hillsburgh ON N0B 1Z0</p><br/><p>Distorted Display</p></a></li>
 <li><a href="#custDetails" style="text-decoration:none"><p>Tom Cruise</p><p>RR5 Perth ON K7H 3C7</p><br/><p>Issue with set-top box</p></a></li>
</ul>                
        </div>
        </div><!-- /content -->

        <div data-role="footer" data-position="fixed">
            <h4>Page Footer</h4>
        </div><!-- /footer -->
</div><!-- page -->
于 2013-06-28T10:02:07.963 回答