jQuery |列表视图需要协助,并在单击新页面时传递数据

时间:2012-08-15 19:54:00

标签: jquery ajax listview mobile

我有一个从Web服务动态提取的项目列表。 它看起来像这样:

http://i.imgur.com/cXHBk.png

我想要发生的是,我想要点击的列表项,以某种方式被声明为变量....以及被点击的项目的信息,将被传递到另一个页面。我不知道该怎么做,并希望有人能指出我正确的方向。

到目前为止,我已经能够提出这个问题,但变量'someData'一直未定义。

$('#dogs ul').click(function(e) {
var someData = jQuery(this).data('<li>');
alert(someData);
});

}

以下是将所有信息整合到listview中的代码:

$(data).find('NewDataSet').each(function(i) {
    var listView = $('<ul data-role="listview" data-inset="true" data-split-theme="b">').data('role', 'listview');

    $(data).find('Table').each(function() {
        var title = $(this).find('ShortDesc').text();
        var description = $(this).find('LongDesc').text();
        var thumbnail = $(this).find('ThumbURL').text();
        var listItem = $('<li/>');
        $('<a href="#"><img id="bla" src="' + thumbnail + '"><div id="desc"><h4>' + title + '</h4> <p> <br/>' + description + '</p></div>').appendTo(listItem);
        $(listItem).appendTo(listView);
    });

    $(listView).appendTo('#dogs');
});


$('#dogs ul').listview();

如果有人能指出我正确的方向,或者告诉我我做错了什么,我将不胜感激。

谢谢!

1 个答案:

答案 0 :(得分:0)

我觉得你很亲密。您可以使用jQuery.data()创建每个li元素的数据。

$(data).find('Table').each(function() {

    //...

    var tableData = $(this); // 'this', in your example, refers to the Table data
    var listItem = $('<li/>').data('TableData', tableData);
});

要将其恢复并将其传递到另一个页面,您可以处理点击并将数据发布到另一个页面。如果更容易,也可以在查询字符串中附加数据。

$('#dogs ul li').click(function(e) {
    e.stopPropagation();
    var tableData = $(this).data('TableData');
    $.mobile.changePage("anotherpage.php", {
        type: "post",
        data: $(tableData).serialize() // I'm not sure of your data format, so serialize() this may not work
    });
});