在JQuery Mobile pageshow（）事件上訪問JSON數據

我正在使用單個頁面JQuery Mobile站點。當JSON數據被加載並且DOM被操縱客戶端時，JQuery初始化最初被設置爲false。內容加載和DOM操作後，JQuery Mobile被初始化。在JQuery Mobile pageshow（）事件上訪問JSON數據

初始化完成後，我打算使用Ben Alman的replaceText插件將JSON放入輸出HTML中的某些佔位符，因此「XXFIRST_NAMEXX」等佔位符變爲「John Smith」。

我還沒有進入更換部件b/c我無法從JQuery Mobile的pageshow（）事件中訪問JSON數據，即使在加載頁面的事件序列中觸發了最後一個事件。

下面是我的代碼的簡化和註釋版本。我正在使用JQuery 1.7.1和JQuery Mobile 1.1.0 我在這裏錯過了什麼？謝謝！

// jQuery Mobile initialization 
$(document).bind("mobileinit", function() { 
    //prevent JQM from initializing until after content has been loaded in .getJSON callback; 
    $.mobile.autoInitializePage = false; 
}); 

$(document).bind("pageshow", function(event, data){ 
    console.log('pageshow fires'); //fires 4th 

    //DROP-INS 
    //need to replace text within manipulated and initialized html 
    var resplaceScope, strDisplayName, strSchoolName, strOfferTitle; 
    replaceScope = $('body *'); 
    //collect variables from json data 
    strOfferTitle = data.content.offer_vars.offer_title; //ERROR Uncaught TypeError: Cannot read property 'offer_vars' of undefined 
    replaceScope.replaceText(/XXOFFER_TITLEXX/gi, strOfferTitle); 
}); 

$(document).ready(function(){ 

    console.log('document.ready fires'); //fires 1st 

    $.getJSON('io_content.json', function(data) { 
     console.log('getJSON fires'); //fires 2st 
     getContent(data); 
     // ... once code is manipulated by getContent, Jquery is ready to initialize 
     $.mobile.initializePage(); 
    }); 

    function getContent(data){ 
     console.log('getContent fires'); //fires 3rd 
     // ... code to manipulate content client side before jquery mobile initializes 
    } 

});

來源

2012-07-19 emkmail2

我不能完全肯定這是怎麼回事，但有可能，你希望傳遞到「pageshow」回調「數據」參數是一樣的，在「數據」變量「getJSON」回調？他們是不同的對象，只是碰巧都被命名爲「數據」。「pageShow」中的一個只有一個「prevPage」屬性，該屬性包含對DOM元素的引用，該元素表示剛剛導航的頁面。 getJSON回調中的一個具有從數據源獲得的實際數據;一旦回調完成執行，它就消失了。

如果無法在JSON回調中完成所有這些初始化，那麼您可以嘗試使用jQuery的data（）函數來存儲頁面中某些DOM元素所需的JSON位。 http://api.jquery.com/jQuery.data/

這有幫助嗎？

來源

2012-07-20 16:26:25

訪問是的，這確實有助於！我沒有想到數據是兩個不同的東西 - 一個是獲得JSON，另一個是pageShow。一旦我全局聲明瞭我的dropin變量，並在getContent（）中定義它們，pageShow就擁有了它需要執行的操作。非常感謝！ – emkmail2 2012-07-20 16:41:26

我很難做到這一點data()，或甚至jqmData()這是應該用什麼來代替data()。從文檔：

當jQuery Mobile的，jqmData和jqmRemoveData工作應該到位的jQuery核心的數據和removeData方法的使用（注意這包括$ .fn.data，$ .fn.removeData，和$ .data， $ .removeData和$ .hasData實用程序），因爲它們自動包含獲取和設置名稱空間數據屬性（即使當前沒有名稱空間正在使用中）。

爲了克服這一點，我存儲在的getJSON回調localStorage的數據，然後可以從pageShow

來源

2012-07-20 16:29:15 danwellman

jqmData（）...有趣的是，我不知道。不知何故，我錯過了在以前的項目上吹過手！ – 2012-07-20 16:35:51

:)它可能是一個相對較新的加法，我沒有使用過長的框架。但是就在前一天我反對這個確切的問題...... – danwellman 2012-07-20 17:16:54

在JQuery Mobile pageshow（）事件上訪問JSON數據

回答

相關問題