Jquery移動和動態鏈接

只需進入一個Jquery移動平臺進行工作項目，我遇到了一個小問題，我一直在旋轉我的車輪一段時間，因此有時間進行同行評審。Jquery移動和動態鏈接

的概念是這樣的：有一個「Facebook最近條目」按鈕，主頁面。單擊時，該按鈕即可轉到結果從一個網站的RSS Feed中提取，幷包裹在一個標籤指向一個書籤在同一頁上（與JQM慣例保持一致），第二頁。到目前爲止，我沒有問題，鏈接正確填充標題，並且href正確指向href =「detailpage」+ i。問題是，當我試圖做出相應的內容容器，並把它添加到具有匹配detailpage +本人身份證body標籤的鏈接只是把我帶回到主頁，而不是新追加的內容。

我的想法是，也許dom不知道創建後的新東西是否存在，因此，沒有匹配的元素，只返回第一個「page」元素。

我使用JQM 1.0b2和jQuery 1.6.2與PhoneGap的

操作我做如下所示：

$('#gotoContentpage').click(function(){ 

    $("#contentlist").empty(); //empty the list elements we've placed in the html 
    $.ajax({ 
      type: "GET", 
      url: "https://www.facebook.com/feeds/page.php?id=212385708771580&format=rss20", 
      dataType: "xml", 
      success: parseXml 
      }); 

    function parseXml(xml){  
     var i =1; 
     $(xml).find("item").each(function(){ 
      var pageid = "detailpage" + i;      
      $("#contentlist").append("<li><a href='#"+pageid+"'>" + ($(this).find("title").text()) + "</a></li>"); 

      $("body").append("<div data-role='page' id='"+pageid+"'><div data-role='header'><a data-rel='back'>back</a><h1>" + ($(this).find("title").text()) + "</h1></div><div data-role='content'>" + ($(this).find("description").text()) +"</div><div data-role='footer'><h1> detail Page Footer </h1></div></div>"); 

      i++; 
      }); 


      $("#contentlist").listview('refresh'); 

     } 


    });

這裏是正在爲常規的HTML輸出HTML頁：http://deepblue.cs.camosun.bc.ca/~c0029098/caleb/test.html

編輯：後幾個小時紡紗我的車輪andchanging我的做法，似乎我已經找到了解決辦法。代替把HREF點像所有的初始加載其他環節的書籤我不得不利用$ .mobile.changePage功能得到地方，我需要去。

"<li><a href='javascript:void(0)' onclick=\"javascript: $.mobile.changePage($('"+'#'+pageid+ "'), 'slide');\">" + "foobar"</a></li>"

希望可以幫助別人。

來源

2011-08-04 Ian Hoar

真正有用的帖子，一個小東西，你缺少的「？」關於url後的.php ...次要我知道。 :) – jimbo

很高興它幫助你。（修復了網址錯誤，謝謝！） –

我相信，動態添加的頁面應該添加data-url屬性，以便在導航中啓用它。如果我記得正確的話，這是JQM大修後退按鈕和歷史記錄工作時添加的。 ID在導航方面不再有用。

你的情況

即：

$("body").append("<div data-role='page' data-url='"+pageid+"' id='"+pageid+"'><div data-role='header'><a data-rel='back'>back</a><h1>" + ($(this).find("title").text()) + "</h1></div><div data-role='content'>" + ($(this).find("description").text()) +"</div><div data-role='footer'><h1> detail Page Footer </h1></div></div>");

如果還有問題，那麼.page()可能需要在動態添加頁面被調用。

我添加動態頁面的代碼如下所示：

$('<div data-role="page" id="infopage" data-url="infopage"></div>').appendTo('body').page();

可能調用.page()的情況下，只是增加了data-url，當我有時間和更新我的回答，我會檢查。

來源

2011-10-03 15:13:28 amcc

Jquery移動和動態鏈接

回答

相關問題