JQUERY

Question

使用jQueryMobile（jQM 1.2.1）和PhoneGap（cordova-2.7.0）。这里现在面临Preloader问题。这里当我们点击Page1的提交按钮时，会有一些API被发送到服务器。在Pagebeforeload of Page2事件中我们收集结果并传递给数组以便在HTML中进行提取。然后我们需要隐藏预加载器。但问题是当我们点击按钮加载不起作用时。

首先我们使用jQM默认Preloader进行检查。但当它失败。所以我手动创建了一个预加载器并在按钮单击时调用它。

function showLoading()
{
    $("body").append("<div id='overlay'></div> < img src = 'images/loading.gif' id = 'loader_image' / > ");
}

这里我显示了我点击按钮事件的代码。

$("#submit_booking_step_one").live('click', function(event) {

    // $.mobile.loading('show');
    showLoading();
    var Valresult = searchValidation()
    if (Valresult == true)
    {
        var json = 1;
        var age_driver = $('#age').val();
        var car_group = $('#car_group_list').val();
        var cmpapi = 'http://www.sampleurl.com/json/get.php?json=' + json + '&age_driver=' + age_driver'';
                ajaxForCmpList(cmpapi);
        //showLoading();
        $.mobile.changePage("#mobile_page_list_bookacar", {reverse: false, changeHash: true});
        event.preventDefault();
    }
});

那有什么解决方案????

Answer 1

尝试调用此脚本...

$(".ui-loader").show();

而不是showLoading（）函数。

DEMO在这里...... http://jsfiddle.net/yeyene/CVv2q/1/

并且也改变了这个事件......

$("#submit_booking_step_one").on('vclick', function(e){
    // your scripts
});

JQUERY

$('#submit_bkg').on('vclick', function(e){
    $(".ui-loader").show(); // onsubmit, show loading

    e.preventDefault();
    location.hash = "submitted_booking";  // another page  

    $.ajax({
        type: 'POST',
        url: 'get_data_source.php?qtype=new_booking',
        data: serialized,
        dataType: "json",
        success: function(data) {

            // your scripts for after successful submit

            $(".ui-loader").hide();  // hide loading back
        }
    });
});

事件发生时，PreLoader不起作用

1 个答案:

JQUERY