2013-02-11 74 views
0

使用1.3.0 RC1後,在頁面重新加載「#subpage」後,任何頁面上都不會顯示後退按鈕。重新加載後不再出現後退按鈕

我知道當您重新加載「#page2」頁面時,後退按鈕不應該出現在第一頁上。但是,如果你點擊另一個鏈接導航到其他頁面,你應該得到後退按鈕,但它不是。

攝製步驟: - 負載的網站頁面1 - 去第2頁,並注意背部按鈕 - 重新加載頁面(這是在「#第2頁」) - 第2頁負荷而不後退按鈕(正確) - 轉到第3頁並注意後退按鈕未顯示

此時我期望看到後退按鈕。即使我進一步閱讀第4,5,6頁,它也不會顯示後退按鈕。

我已將屬性data-add-back-btn="true"添加到僞頁面容器。我還在document對象上的mobileinit事件中添加了$.mobile.page.prototype.options.addBackBtn = true;。什麼都沒有

回答

0

這必須工作,我已經測試了JQM 1.2和1.3 RC1,這裏有一個例子:

<!DOCTYPE html> 
<html> 
<head> 
    <title>jQM Complex Demo</title> 
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0"/> 
    <link rel="stylesheet" href="http://jquerymobile.com/demos/1.3.0-rc.1/css/themes/default/jquery.mobile-1.3.0-rc.1.css" /> 
    <script src="http://www.dragan-gaic.info/js/jquery-1.8.2.min.js"></script>  
    <script src="http://jquerymobile.com/demos/1.3.0-rc.1/js/jquery.mobile-1.3.0-rc.1.js"></script>  
</head> 
<body> 
    <div data-role="page" id="index"> 
     <div data-theme="a" data-role="header"> 
      <h3> 
       First Page 
      </h3> 
      <a href="#second" class="ui-btn-right">Next</a> 
     </div> 

     <div data-role="content"> 

     </div> 

     <div data-theme="a" data-role="footer" data-position="fixed"> 

     </div> 
    </div> 
    <div data-role="page" id="second" data-add-back-btn="true"> 
     <div data-theme="a" data-role="header"> 
      <h3> 
       Second Page 
      </h3> 
      <a href="#third" class="ui-btn-right">Back</a>   
     </div> 

     <div data-role="content"> 

     </div> 

     <div data-theme="a" data-role="footer" data-position="fixed"> 

     </div> 
    </div> 
    <div data-role="page" id="third" data-add-back-btn="true"> 
     <div data-theme="a" data-role="header"> 
      <h3> 
       Third Page 
      </h3> 
      <a href="#fourth" class="ui-btn-right">Next</a> 
     </div> 

     <div data-role="content"> 

     </div> 

     <div data-theme="a" data-role="footer" data-position="fixed"> 

     </div> 
    </div> 
    <div data-role="page" id="fourth" data-add-back-btn="true"> 
     <div data-theme="a" data-role="header"> 
      <h3> 
       Fourth Page 
      </h3> 
     </div> 

     <div data-role="content"> 

     </div> 

     <div data-theme="a" data-role="footer" data-position="fixed"> 

     </div> 
    </div>  
</body> 
</html> 

如果你想,給我你的榜樣,我會看看它。

0
Can be done for web sites like this: 

your starting page id = "pageIndex" 

if you are using jquerymobile1.2.0.js, then modify the framework code like this: 

    if (o.addBackBtn && 
       role === "header" && 
       ***$page.jqmData("url") !== "pageIndex"***) { 

       // framework code modified for back button id: sheetal 08/02/2013 

       if (backBtnId !== undefined) { 
        backBtn = $("<a href='javascript:void(0);' class='ui-btn-left' data-"+ $.mobile.ns +"rel='back' data-"+ $.mobile.ns +"icon='arrow-l' id='" + backBtnId + "'>"+ o.backBtnText +"</a>") 
         // If theme is provided, override default inheritance 
         .attr("data-"+ $.mobile.ns +"theme", o.backBtnTheme || thisTheme) 
         .prependTo($this);      

       }else { 

        backBtn = $("<a href='javascript:void(0);' class='ui-btn-left' data-"+ $.mobile.ns +"rel='back' data-"+ $.mobile.ns +"icon='arrow-l'>"+ o.backBtnText +"</a>") 
        // If theme is provided, override default inheritance 
        .attr("data-"+ $.mobile.ns +"theme", o.backBtnTheme || thisTheme) 
        .prependTo($this); 

       } 
      } 
相關問題