動態加載collpase和listview

花了一天時間都沒弄出來,突然間看到了這個,完美的解決了我的問題。通過ajax獲取的信息加載collpase和listview

http://jsfiddle.net/Palestinian/VLc65/

裏面的核心代碼:

var data = [{
    "title": "Category 1",
        "items": [
        "one", "two", "three"]
}, {
    "title": "Category 2",
        "items": [
        "four", "five", "six"]
}, {
    "title": "Category 3",
        "items": [
        "seven", "eight", "nine", "ten"]
}];

$.each(data, function (i, v) {
    var items = v.items;
    var col = $("<div/>", {
        "data-role": "collapsible"
    });
    var title = $("<h3/>", {
        text: v.title
    }).appendTo(col);
    var list_items = '';
    $.each(items, function (x, y) {
        list_items += "<li><a href='#'>" + y + "</li>";
    });
    var list = $("<ul/>", {
        "data-role": "listview",
            "id": "listview" + i,
            "data-inset": true
    });
    $(list).append(list_items);
    $(list).appendTo(col);
    $("#stuff").append(col).collapsibleset().trigger("create");
});

<div data-role="page">
    <div data-role="content">
        <div data-role="collapsible-set" id="stuff"></div>
    </div>
</div>


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章