通过jquery mobile上的查询字符串传递变量

时间:2014-06-05 14:35:57

标签: javascript jquery jquery-mobile cordova

我正试图在我的手机间隙应用程序中将变量从一个页面传递到另一个页面。然而,这个功能似乎永远不会被调用。

以下是建立链接的内容:

$.each(data, function(index) {
    $("#listpetsList").append("<li><a href='javascript:loadPetdialog(" + data[index].AnimalCode + ")' data-rel=\"dialog\" data-transition=\"flip\"><img src='" + data[index].Picture + "'><h2>" + data[index].Name + "</h2><p>Type</p></li>");
});

继承loadPetDialog:

var editingId = 0

function loadPetdialog(id) {
    alert("hit");
    editingId = id;
    $.mobile.changePage("#select-pet-dialog");
}

然而,它似乎永远不会被击中

1 个答案:

答案 0 :(得分:3)

不要在jQuery Mobile中使用内联JavaScript。

这样做:

$.each(data, function(index) {
    $("#listpetsList").append("<li><a data-custom='"+ data[index].AnimalCode + "' data-rel=\"dialog\" data-transition=\"flip\"><img src='" + data[index].Picture + "'><h2>" + data[index].Name + "</h2><p>Type</p></li>");
});

$(document).on('click', '#listpetsList li a', function(){ 
    editingId  = $(this).prop('data-custom');
    $.mobile.changePage("#select-pet-dialog");
});

var editingId = 0

与jQuery Mobile一起使用时,内联JavaScript具有不工作甚至失火的倾向。因此,最好将click事件绑定到每个listview元素,并在单击它时获取特定的li元素值。

在我的示例中,我将click事件绑定到每个listview元素。 data [index] .AnimalCode保存为自定义数据值。单击列表视图时,单击事件将仅在选定的列表视图元素上触发,然后我们可以轻松找到自定义数据值,将其添加到全局变量并以编程方式更改页面。

Click事件的约束方式是它不关心listview是否有内部内容。它适用于任何现有和未来的列表视图内容。

更新

我用你的代码做了一个工作示例:http://jsfiddle.net/Gajotres/92XG5/

此代码与上周示例之间只有一个区别。

更改此行:

    editingId  = $(this).prop('data-custom');

到这一行:

    editingId  = $(this).attr('data-custom');