2011-07-18 90 views
0

我有一個移動網絡應用程序。它目前正在使用iUI。我已經重寫了jQuery Mobile來嘗試功能。我還沒有想到的一件事是如何用Ajax替換內容。jQuery Mobile - 將更多記錄添加到列表中

我有記錄列表。我只想一次顯示5條記錄。 iUI有一個功能,可以告訴鏈接「replace-with」,它將用Ajax返回的數據替換鏈接。

那麼我該如何做到這一點與jQuery的移動?我已經嘗試了一些jQuery的電話,但一般來說,我這個錯誤,一切都停止工作:

b.height(i + j).data("page") is undefined 
[Break On This Error] a.mobile.minScrollBack&&(j=0);d&&(d.he...ght("").data("page")._trigger("hide", ... 

回答

3

您可以使用JQuery的一個功能,加載數據(在下面的情況下,進入一個未排序列表):

 
function load_list(page_num) { 
    $.get('location_of_output_script.php?page=' + page_num, function (data) { 
     $('#add_html_to_me > li.click_to_see_more').remove(); 
     $('#add_html_to_me').append(data); 
    }); 
} 

你的頁面將需要一些元素(一個未排序的列表在這種情況下),以該新項目將附加:本examp

 
<div data-role="content"> 
    <ul id="add_html_to_me"></ul> 
</div> 

你的輸出腳本(「location_of_output_script.php」 le)可以在單擊按鈕時(或者當用戶滾動到足夠靠近列表底部時)返回所需數量的結果。下面是輸出我想象的樣本:

 
<li>List item 1</li> 
<li>List item 2</li> 
<li>List item 3</li> 
<li>List item 4</li> 
<li>List item 5</li> 
<li class="click_to_see_more">Click Me To View More Rows</li> 

一些注意事項:

  • 在我的例子,你會加載一個按鈕拖到從服務器端腳本的每個輸出端那會在添加下一組行之前被刪除。

  • 您可以替換列表中的內容,而不是使用.html()函數而不是.append()來添加它。

  • 您可能需要調用< ul>標籤上的.listview(),以使JQuery Mobile樣式成爲列表中的新內容。

  • 如果您想要添加微調器或某種類型的進度條,您可以在進行$ .get調用之前將其顯示出來,然後將其隱藏在該調用的成功函數中。

+0

這實際上是我在做什麼。我有一個錨標記中的網址,但我本質上是壓制默認的點擊行爲,並調用與Ajax的網址內容添加到列表。我想jQuery手機正在做一些額外的工作,所以漸進式增強技術可能無法與jQuery的移動? – Dustin

+0

我拿出錨標籤,並使用span標籤,現在它似乎工作正常。謝謝。 – Dustin

相關問題