集jQuery Mobile的屬性分頁

我有一個移動網頁我的應用程序，它使用jQuery Mobile的「可摺疊」數據角色隱藏微觀柱（哈特爾的教程），直到用戶點擊他們擴大。集jQuery Mobile的屬性分頁

我還使用了修改PAGINATE呈現PAGINATE鏈接。 https://gist.github.com/jugyo/3135120

<div data-role="collapsible"> 
    <h3>Show Microposts (<%= @user.microposts.count %>)</h3> 
    <ul data-role="listview"> 
    <%= render @microposts %> 
    </ul> 
    <%= will_paginate @microposts, 
    renderer: WillPaginate::ActionView::JqueryMobilePaginateLinkRenderer, 
    previous_label: 'Prev', 
    next_label: 'Next' 
    %> 
</div>

我的問題是：我該如何將事件添加到PAGINATE點擊？我想讓列表摺疊（默認），第一次加載頁面時用data-role =「collapsible」，但當我點擊next（或更高版本，prev）時我希望可摺疊容器添加data-collapsed = 「false」屬性，以便列表打開。（單擊next並再次進入摺疊列表沒有任何意義）

我是否將它放在具有分頁代碼的rb中？如果是這樣，我該如何參考頁面元素？或者我在某處放置了一些jQuery ...？

任何協助讚賞。

來源

2013-04-18 grooble

您可以將class或id添加到您的分頁。我加入了一個id：

<%= will_paginate @microposts, 
    renderer: WillPaginate::ActionView::JqueryMobilePaginateLinkRenderer, 
    id: 'my_pagination', 
    previous_label: 'Prev', 
    next_label: 'Next' 
%>

然後給你的主要股利某種標識符：

<div data-role="collapsible" id="my_list">

現在你可以用jQuery手動激活它：

$("#my_pagination").click(function() { 
    $("#my_list").data("collapsed", $("#my_list").data('collapsed') == 'false' ? 'true' : 'false') 
});

來源

2013-04-18 05:12:53 Trip

謝謝您的回答旅行。我今天在這工作，並且jQuery被調用（使用alert（）進行檢查），但沒有打開列表。在你的回答中，當你說：「your_list.data」時，我是通過ul上的一個id來獲得的嗎？（沒有工作），或... 對不起，你能填補我在這裏的空白嗎？ – grooble 2013-04-18 12:39:34

啊，我只是想出了什麼'my_list'並更新了答案。 – Trip 2013-04-18 12:54:12

感謝堆。明天我會有一個裂縫。 – grooble 2013-04-18 12:56:09

集jQuery Mobile的屬性分頁

回答

相關問題