Jquery Mobile不能附加到主體

我想追加動態生成的頁面到正文，但儘管我沒有看到控制檯中的任何錯誤，並沒有看到UI上的動態頁面。我錯過了什麼？一旦我得到這些，我也有多個頁面，當我瀏覽列表項目到這些頁面時，需要生成所有這些頁面。Jquery Mobile不能附加到主體

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
<title>Appstore</title> 
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> 
<meta http-equiv="Pragma" content="no-cache" /> 
<meta http-equiv="Expires" content="0" /> 
<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"/> 



<script src="js/chaseappstore.js"></script> 




<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" 
    /> 
<link rel="stylesheet" href="css/chaseappstore.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js">  </script> 

<script> 
if(/dy.htm/.test(window.location.href)) 
{ 
alert("h"); 

pg=CreatePageheader(); 
alert(pg); 
$('body').append(pg); 
alert("appended"); 

} 


function CreatePageheader() 
{ 
alert('hh'); 
pageDOM="<div id='LatestBuilds' data-role='page' data-transition='slide' data-  cache='never' data-theme='aa'><div class='mFuturePageHeader chromeBar acb' data- role='header' data-tap-toggle='false' data-id='header' data-position='fixed'><table><tbody><tr><td class='left'><div class='hidden' style=''><a href='options.htm' data-rel='dialog' data-transition='slidedown'><img src='images/logout_60x60_tp.png' class='hidden logoutButtonA' /></a></div><div class='hiddenshow' style=''><a href='javascript:ref()' data-rel='dialog' data-transition='slidedown'><img src='images/Home.png' class=' hiddenshow logoutButtonA' /></a></div></td><td class='center mFuturePageHeaderTitle'>Chase Appstore - Latest Builds</td><td class='right'></td></tr></tbody></table></div>" 
pageDOM+="<div data-role='content'><div data-role='collapsible'data-theme='a' data-collapsed='false' data-content-theme='d'><h2>iPhone/iPod</h2><ul data-role='listview' data-filter='true' data-inset='false' id='iPhoneCIG'></ul></div><div data-role='collapsible' data-theme='a' data-collapsed='false' data-content-theme='d'><h2>iPad</h2><ul data-role='listview' data-filter='true' data-inset='false' id='iPadCIG'></ul></div><div data-role='collapsible'data-theme='a' data-collapsed='false' data-content-theme='d'><h2>Windows</h2><ul data-role='listview' data-filter='true' data-inset='false' id='WindowsCIG'></ul></div><div data-role='collapsible' data-theme='a' data-collapsed='false' data-content-theme='d'><h2>Android</h2><ul data-role='listview' data-filter='true' data-inset='false' id='AndroidCIG' ></ul></div></div>" 
    pageDOM+="<div data-role='footer' data-id='footer' data-theme='a' data-position='fixed'><div data-role='navbar'><ul><li><a href='#LatestProdBuilds'>Prod<br/>Links</a></li><li><a href='#LatestBuildsTSS'>TSS/<br/>WSS</a></li><li><a href='#LatestBuildsUR'><br/>CARD</a></li><li><a href='#' class='ui-btn-active ui-state-persist'>CIG/<br/>MEP</a></li><li><a href='#AllBuilds'>All<br/>Builds</a></li></ul></div></div></div>" 



return pageDOM; 
} 



</script> 



</head> 

<body class="body"> </body> 




</html>

來源

2013-08-19 user2643660

嘗試'$ .mobile.pageContainer.append（頁）;' – Omar

奧馬爾有人靠近，你需要以後做的一切都改變頁面它附加到頁面容器之後。此外，請仔細閱讀代碼，記住要爲變量使用var，並且在創建頁面時可能需要考慮使用對象而不是超長字符串。也許通過JSLint運行你的JavaScript。

給這個一展身手：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
<title>Appstore</title> 
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> 
<meta http-equiv="Pragma" content="no-cache" /> 
<meta http-equiv="Expires" content="0" /> 
<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"/> 



<script src="js/chaseappstore.js"></script> 




<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" 
    /> 
<link rel="stylesheet" href="css/chaseappstore.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js">  </script> 

<script> 

function load() { 
    var pg = CreatePageheader(); 
    $.mobile.pageContainer.append(pg); 
    $.mobile.changePage('#LatestBuilds'); 
} 


function CreatePageheader() 
{ 
var pageDOM="<div id='LatestBuilds' data-role='page' data-transition='slide' data-  cache='never' data-theme='aa'><div class='mFuturePageHeader chromeBar acb' data- role='header' data-tap-toggle='false' data-id='header' data-position='fixed'><table><tbody><tr><td class='left'><div class='hidden' style=''><a href='options.htm' data-rel='dialog' data-transition='slidedown'><img src='images/logout_60x60_tp.png' class='hidden logoutButtonA' /></a></div><div class='hiddenshow' style=''><a href='javascript:ref()' data-rel='dialog' data-transition='slidedown'><img src='images/Home.png' class=' hiddenshow logoutButtonA' /></a></div></td><td class='center mFuturePageHeaderTitle'>Chase Appstore - Latest Builds</td><td class='right'></td></tr></tbody></table></div>" 
pageDOM+="<div data-role='content'><div data-role='collapsible'data-theme='a' data-collapsed='false' data-content-theme='d'><h2>iPhone/iPod</h2><ul data-role='listview' data-filter='true' data-inset='false' id='iPhoneCIG'></ul></div><div data-role='collapsible' data-theme='a' data-collapsed='false' data-content-theme='d'><h2>iPad</h2><ul data-role='listview' data-filter='true' data-inset='false' id='iPadCIG'></ul></div><div data-role='collapsible'data-theme='a' data-collapsed='false' data-content-theme='d'><h2>Windows</h2><ul data-role='listview' data-filter='true' data-inset='false' id='WindowsCIG'></ul></div><div data-role='collapsible' data-theme='a' data-collapsed='false' data-content-theme='d'><h2>Android</h2><ul data-role='listview' data-filter='true' data-inset='false' id='AndroidCIG' ></ul></div></div>" 
    pageDOM+="<div data-role='footer' data-id='footer' data-theme='a' data-position='fixed'><div data-role='navbar'><ul><li><a href='#LatestProdBuilds'>Prod<br/>Links</a></li><li><a href='#LatestBuildsTSS'>TSS/<br/>WSS</a></li><li><a href='#LatestBuildsUR'><br/>CARD</a></li><li><a href='#' class='ui-btn-active ui-state-persist'>CIG/<br/>MEP</a></li><li><a href='#AllBuilds'>All<br/>Builds</a></li></ul></div></div></div>" 



return pageDOM; 
} 



</script> 



</head> 

<body class="body" onload="load()"> </body> 




</html>

來源

2013-08-20 02:49:23

Jquery Mobile不能附加到主體

回答

相關問題