为什么jquery mobile没有呈现我的所有html或加载javascript？

Question

我有这个:

    <title>MyMobile</title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>

<title>My Mobile</title>

<style type="text/css"> 
    table { width:100%; }
    table caption { text-align:left;  }
    table thead th { text-align:left; border-bottom-width:1px; border-top-width:1px; }
    table th, td { text-align:left; padding:6px;border: inset 1pt} 
</style> 

如果我手动转到页面,我的表格元素看起来很好.我可以看到边框等.如果我从另一个移动页面获取页面,页面加载正常但表格CSS的东西永远不会被应用.没有风格.打造风格,风格.

到底是怎么回事？

谢谢.

编辑:不加载我的JavaScript.刷新.一切都有效.

编辑:如果我按下后退按钮到另一页面也一样.不是一切都加载.

Answer 1

每当你有A标签时,JQM默认使用AJAX来加载这些页面 - 然后忽略除了data data-role = page元素中包含的内容之外的所有内容.

你有3个选择:

1. 您可以告诉JQM始终禁用AJAX(通过将ajaxEnabled设置为false)并将页面加载为"普通浏览器" - 这将重新加载所有javascript包含,样式表等...

2. 您可以在ONE .html页面中包含所有不同的div data-role = page,这样JQM在页面之间导航时将不需要加载任何其他内容

3. 您仍然可以使用AJAX并加载外部文件,但是您需要在DIV本身中包含所有代码(HTML/CSS/JS).请注意,在此选项中,您需要附加到不同的事件(pageinit/beforeshow/show/hide)而不是$ .ready(因为JQM将处理它,而DOMContentReady实际上不会触发.

您可以在文档中阅读所有相关内容

希望这可以帮助...