jQuery 移动设备：header 在调用页面中显示不正确

Question

这是我的 HTML 代码

<div data-role="page" id="main-body">
    <div data-role="header">
        <!--<a href="#"><img src="img/back.png" width="30" height="30" class="ui-btn-left" /></a>-->
        <img src="img/share.png" width="30" height="30" class="ui-btn-right" />
        <h1>Hello world</h1>
    </div>
    
    <ul data-role="listview" data-inset="true">
        <li><a href="#asked-question-body">Acura</a></li>
        <li><a href="#">Audi</a></li>
        <li><a href="#">BMW</a></li>
        <li><a href="#">Cadillac</a></li>
        <li><a href="#">Ferrari</a></li>
    </ul>          
</div>

<div data-role="page" id="asked-question-body">
    <div data-role="header">
        <a href="#main-body"><img src="img/back.png" width="30" height="30" class="ui-btn-left" /></a>
    </div>
        
    <div data-role="main" class="ui-content">
        <div class="ui-body ui-body-a ui-corner-all">
            <h3>Heading</h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse accumsan blandit fermentum. Pellentesque cursus mauris purus, auctor commodo mi ullamcorper nec. Donec semper mattis eros, nec condimentum ante sollicitudin quis. Etiam orci sem, porttitor ut tellus nec, blandit posuere urna. Proin a arcu non lacus pretium faucibus. Aliquam sed est porttitor, ullamcorper urna nec, vehicula lorem. Cras porttitor est lorem, non venenatis diam convallis congue.</p>
        </div>
    </div>
</div>

它完美地显示了 id="main-body" header，但是 id="asked-question-body" 没有正确显示它的 header。我想将其 header 完美显示为 main-body 页面。

main-body截图是

和asked-question-body

提前致谢。

Answer 1

添加到提问正文页面

<div data-role="header">
     <h1></h1>
     <a href="#main-body" class="ui-btn ui-btn-icon-notext ui-icon-btnback" data-icon="btnback"></a>
</div>

CSS

 <style>
    .ui-icon-btnback:after {
      background: url(back.png) 50% 50% no-repeat;         
    }
</style>

jQuery 移动设备：header 在调用页面中显示不正确

jQuery Mobile: header does not show correctly in calling page

html

jquery-mobile

cordova

jquery-mobile-listview