如何通過HTML 5存儲本地ipad/iphone上的數據並在設備上線時提交它們

Question

這裏是場景：有一個提問者包含3個問題，每個問題有4個多個答案。用戶將選擇一個答案，每個問題，這些數據存儲在標籤隱藏的形式，即

<label id=q1>A</label> 
<label id=q2>C</label> 
<label id=q3>D</label> 

現在的情況下，將設備連接到這些數據可以很容易地提交了互聯網，但如果該設備具有沒有互聯網，我需要找到一種方法將標籤數據存儲在用戶的設備上，然後下一次有連接時，應用程序將有一個提交按鈕，它將提交所有存儲的數據（每次提問者被回答）。

感謝

Answer 1

我會做的是保存在localStorage數據（雖然此鏈接指向的PhoneGap文檔，localStorage的是HTML5功能，非常有用），並定期調用，將檢查是否有東西送功能。

因此，要檢查網絡連接的可用性：

function isOnline(){ 
    try{ 
     var status = navigator.network.connection.type; 
     var val = (status != 'none' && status != 'unknown'); 
     return val; 
    }catch(err){ console.error('isOnline(): '+err); return false; } 
} 

包括以下幾行代碼添加一些功能，本地存儲，因爲它只是允許保存字符串，但是這兩個功能將能夠以存儲JSON數據：

Storage.prototype.setObject = function(key, value) { 
    this.setItem(key, JSON.stringify(value)); 
} 
Storage.prototype.getObject = function(key) { 
    var value = this.getItem(key); 
    return value && JSON.parse(value); 
} 

在您的表單提交處理程序中，檢查是否存在連接。如果不是，保存要發送的數據：

if(isOnline()){ 
    // do stuff 
}else{ 
    var data = // The data to be sent 
    var toBeSent = localStorage.getObject('toBeSent') || []; 
    toBeSent.push(data); // It's better to store the data in an array, in case there's more than a questioner to be sent 
    localStorage.setObject('toBeSent', toBeSent); 
} 

之後寫檢查和發送數據的功能：

function sendPending(){ 
    var toBeSent = localStorage.getObject('toBeSent') || []; 
    var data; 
    for(var i in toBeSent){ 
     data = toBeSent[i]; 

     // send data 
    } 
    // Remove the list 
    localStorage.removeItem('toBeSent'); 
} 

最後，執行定期的功能：

setInterval(sendPending, 60000); // The system will check every minute if there's something to send