javascript-jQuery Mobile显示空白

2019-10-29 12:36:08 阅读：179 来源： 互联网

标签：jquery-mobile css html javascript jquery

我正在构建一个JQuery Mobile Web应用程序,并且遇到了一个有趣的问题.我有一个列表视图,当我单击菜单行之一时,第2页将按预期加载.但是,当我单击“后退”按钮时,页面1的页面将加载半秒钟,然后页面2会返回(无过渡).

这是2页的代码：

<section id="more" data-role="page">
    <header data-role="header" data-position="fixed" class="AppHeader">
        <h1>More</h1>
    </header>

    <div data-role="content">
        <ul data-role="listview" data-filter="false" id="moreList">
            <li><a href="#historyOfLandmarks" data-transition="slide"><h1>History of Boston Landmarks</h1></a></li>
        </ul>
    </div>
</section>

<section id="historyOfLandmarks" data-role="page">
    <header data-role="header" data-position="fixed" class="AppHeader">
        <a href="#more" data-transition="slide" data-direction="reverse" data-icon="arrow-l" data-rel="back">Back</a>
        <h1>History of Boston Landmarks</h1>
    </header>

    <div data-role="content">
        <p>This is a list of National Historic Landmarks in Boston, Massachusetts.</p>
    </div>
</section>

JS小提琴无法说明问题：http://jsfiddle.net/jakechasan/66vbS/

在其他任何地方,出现此问题：http://jakeserver.com/Apps/BostonLandmarks/B5/landmarks.html

我不明白为什么JSFiddle无法说明问题,但是我的计算机/服务器上的同一文件有此问题？

有任何想法吗？

谢谢.

解决方法:

您自己的CSS负责此问题.

编辑此文件：http://jakeserver.com/Apps/BostonLandmarks/B5/css/styles.css

并从底部删除：

.ui-page{
    display: block !important;
}

我已经成功测试了.

标签：jquery-mobile,css,html,javascript,jquery
来源： https://codeday.me/bug/20191029/1960070.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript-jQuery Mobile显示空白