jquery 1.10 $ .ajax with $ .each調用完成（phonegap）

我在jquery中調用ajax調用時遇到問題，並保持屏幕顯示加載圖標，直到100％完成處理。

我使用phonegap和數據庫，以便從ajax中拉出的項目被加載到數據庫中。代碼運行正常，數據庫100％填充，但我的「＃block-ui」在數據庫$ .each調用100％完成之前已經不存在。另外我的#sync文本以隨機順序顯示。

由於我使用jQuery 1.10，我知道async：false不再有效。有人可以幫忙嗎？

function SyncIt() { 
    $('#recap').text(''); 
    $('#syncit').attr("href", "#"); 
    var db = window.openDatabase("titanware", "1.0", "TitanRoof", 50000000); 
    $('#block-ui').show(); 
    $('#sync').text('Syncing with Titanware'); 
    db.transaction(function(tx) {tx.executeSql('DELETE FROM active_jobs WHERE jb_active != 1');},dbErrorHandler); 
    db.transaction(function(tx) {tx.executeSql('DELETE FROM employees');},dbErrorHandler); 

// Sync Jobs  
    $.ajax({ 
    type: 'GET', 
    url: 'http://xxxxxxxxx/api/api.php?request_type=m_clients', 
    crossDomain: true, 
    contentType: "application/json; charset=utf-8", 
    dataType: "jsonp", 
    cache: false, 
    success: function(data) { 
    $('#sync').text('Syncing Jobs'); 
    } 
    }).done(function(data) { 

    $.each(data, function (i, item) { 
    // Load Data into the database for jobs   
    db.transaction(function(tx) {tx.executeSql("insert into active_jobs(job_no, comp_name, comp_street, comp_suite, comp_city, comp_state, comp_zip, comp_contact, comp_phone, comp_cell, comp_notes, jb_active) values(?,?,?,?,?,?,?,?,?,?,?,?)", [item.job_no,item.comp_name,item.comp_street,item.comp_suite,item.comp_city,item.comp_state,item.comp_zip,item.comp_contact,item.comp_phone,item.comp_cell,item.comp_notes,'0']);},dbErrorHandler); 

    }) 

    db.transaction(function(tx){ 
    tx.executeSql('SELECT * FROM active_jobs', [], function(tx, results) { 
    var len = results.rows.length; 
    // Show total jobs synced in the #recap div 
    $('#recap').text('Jobs Synced: ' + len); 
    }); 
    }); 

    }); 

// Sync Employees 
    $.ajax({ 
    type: 'GET', 
    url: 'http://xxxxxxx/api/api.php?request_type=get_employees', 
    crossDomain: true, 
    contentType: "application/json; charset=utf-8", 
    dataType: "jsonp", 
    cache: false, 
    success: function(data) { 
    $('#sync').text('Syncing Employees'); 
    } 
    }).done(function(data) { 
    $.each(data, function (i, item) { 
    //Load employees in the database 
    db.transaction(function(tx) {tx.executeSql("insert into employees(user_id, full_name) values(?,?)", [item.user_id,item.full_name]);},dbErrorHandler); 

    }) 

    $('#sync').text('Almost Done'); 
    $('#block-ui').hide(); 

    }); 

}

感謝您的任何反饋

來源

2013-07-03 Teeoney

在$.ajax調用添加async:false。

默認情況下它是true，所以請求是異步發送的。

請參閱jQuery.ajax() documentation瞭解更多詳情。

希望有所幫助。

來源

2013-07-04 07:25:56

async：false標誌不再適用於Jquery 1.10。它在1.8貶值。我在代碼中使用了它，但後來發現1.8貶低了代碼。尋找想法使代碼在使用最新的jQuery構建的同時工作。 – Teeoney

然後你將不得不應用你自己的邏輯，比如設置一些標誌。正如文檔所述，使用'jqXHR.done（）' –

這就是我迷路的地方。我嘗試的所有東西都打破了Ajax調用或數據庫循環。仍然在學習jquery，所以猜測我會繼續嘗試。 – Teeoney

我已經想通過將hide＃block-ui移動到作業插入循環的末尾。這將保持屏幕上的同步圖標，直到ajax循環的那部分完成。

來源

2013-07-08 18:43:08 Teeoney

好你想通了。 :)更好地編輯你的答案併發布工作代碼。它可能有一天會幫助別人。 –

jquery 1.10 $ .ajax with $ .each調用完成（phonegap）

回答

相關問題