我是这个jQM的新手,还有AJAX.
我有一个保持静态页眉和页脚的站点,并用外部.html/.php页面替换#mainContent div.
我发现当我单击其中一个导航栏选项卡(包含在标题中),并且#mainContent被另一个页面替换时,jQuery Mobile样式(按钮,下拉菜单等)会不立即加载.
最初出现默认样式的按钮,然后(如果AJAX加载)一秒钟之后页面执行'刷新类型闪烁',并且按钮被替换为jQM样式版本.
偶尔我会遇到AJAX'加载圈',按钮保持原始样式,直到再次按下"导航栏链接".
我知道这是一个很好的理由.
研究表明使用"$(document).ready(function(){....});" 对于jQM来说并不理想.我在导航脚本中将其替换为"$(document).bind('pageinit',function(){....});",这并没有什么区别(虽然导航按钮仍然有用).
这是我的index.php的基本脚本初始化
<!DOCTYPE html>
<head>
<title>NoteVote</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">
<link rel="stylesheet" href="./NV_home.css">
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
</head>
<body>
<div data-role="page" id="noteVote">
<!-- HEADER -->
<div data-role="header" align="middle" class="header">
<img src="images/banner_post_it.png" align="middle" alt="Banner Image" height="100" width="250"/>
<!-- NAVBAR -->
<div data-role="navbar" data-grid="c" id="navBar">
<ul>
<li><a class="ui-btn" id="coursesButton">Courses</a></li>
<li><a class="ui-btn" id="searchButton">Search</a></li>
<li><a class="ui-btn" id="submitButton">Submit</a></li>
<li><a class="ui-btn" id="accountButton">Account</a></li>
</ul>
</div>
<!-- /NAVBAR -->
</div>
<!-- /HEADER -->
<!--
This is …