如何將變量插入到jqm的pageshow函數中

Question

我不確定這是否可能，但我想知道如何將頁面id傳遞給pageshow函數，如下所示。我懷疑這是一條錯誤的路，但答案暗示了我。有了這個例子傳遞頁和追加頁ID pageshow - 得到＃qanda_entry_1或＃qanda_entry_2等對應於一系列的一個文檔中的頁面。

更新：代碼按下面從DGS

頁面轉換正在發生，但沒有網頁的更新或渲染。我的數據來自全局變量'articles_data'。我無法看到點擊函數中'article'的值如何傳遞到新頁面？警報「警報（文章）」;沒有在pageshow上被解僱。

此外 - 這是一個多頁文檔。

$(document).on("click",".articleLink",function() { 
$(this).addClass('clicked_button'); 
var page = $(this).attr('data-page'); 
var article = $(this).attr('data-id'); 
//alert(article); 
$.mobile.changePage(page, { 
transition: 'slide', 
}); 
}); 

$('div[data-role="page"]').on('pageshow',function(){ 

var page_id = $(this).prop('id'); 
var article = $('.articleLink.clicked_button').attr('data-id').substr(4); 
alert(article); 
$('.articleLink.clicked_button').removeClass('clicked_button'); 

$('#qandahead h1').empty(); 
$('#qanda_text div').empty(); 
jQuery.map(articles_data, function(obj) { 
    if(obj.id === article){ 
     $('#qandahead').html('<h1>'+ obj.title + '</h1>'); 
     $('#qanda_text').html('<h2>'+ obj.title + '</h2>' + 
     '<p>' + obj.introtext + '</p>'); 
    } 

}); 

}); 

我的列表視圖的鏈接結構中產生動態

<li><a class="articleLink ui-link-inherit" data-page="#qanda_entry_0" data-id="art_18"></li> 
<li><a class="articleLink ui-link-inherit" data-page="#qanda_entry_1" data-id="art_9"></li> 

等

Answer 1

使用類似下面的代碼。這會給你的元素引發該事件pageshow

$('div[data-role="page"]').on('pageshow',function(){ 
    var page_id = $(this).prop('id'); 
}); 

更改您的代碼

$(document).on("click",".articleLink",function() { 
    $(this).addClass('clicked_button'); 
    var page = $(this).attr('data-page'); 
    $.mobile.changePage(page); 
}); 

$('div[data-role="page"]').on('pageshow',function(){ 
    var page_id = $(this).prop('id'); 
    var article = $('.articleLink.clicked_button').attr('data-id').substr(4); 
    $('.articleLink.clicked_button').removeClass('clicked_button'); 
    $('#qanda_text div').empty(); 
    $('#qandahead h1').empty(); 
    jQuery.map(articles_data, function(obj) { 
     if(obj.id === article){ 
      $('#qandahead').html('<h1>'+ obj.title + '</h1>'); 
      $('#qanda_text').html('<h2>'+ obj.title + '</h2>' + 
      '<p>' + obj.introtext + '</p>'); 
     } 

    }); 

}); 

這將推廣你的pageshow處理程序，而不需要動態設置它的ID。我有點擔心你的html，因爲你已經通過id引用了兩個元素，並且id一次只能出現在一個頁面上。