0

我在 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();

    });

}

感谢您的任何反馈

4

2 回答 2

0

我通过将隐藏#block-ui 移动到作业插入循环的末尾来解决这个问题。这会在屏幕上保持同步图标,直到 ajax 循环的那部分完成。

于 2013-07-08T18:43:08.860 回答
0

加入async:false你的$.ajax电话。

默认情况下为 true,因此请求是异步发送的。

有关更多详细信息,请参阅jQuery.ajax() 文档

希望有帮助。

于 2013-07-04T07:25:56.797 回答