Question

如果ajax调用花费的时间少于2秒，如何延迟加载指示器？

加载指示器：

  $.mobile.loading('show', {theme:"e", text:"Bitte warten...", textonly:false, textVisible: false});

设置超时将导致2秒后显示加载指示器，无论ajax调用如何：

function load_filter(){
  setTimeout(function(){
    $.mobile.loading('show', {theme:"e", text:"Bitte warten  ...", textonly:false, textVisible: false});
},2000);
$.ajax({
  ...

如何延迟，以便指示器不会在这么短的时间内弹出？

Answer 1

以下代码可以解决问题。让我知道您是否有任何疑问。如果要延迟成功/延迟处理，则也可以在setTimeout回调函数中移动该处理。

    function hideLoader(timeBeforeAjax) {
        let timeafterAjax = new Date();
        let difference = timeafterAjax - timeBeforeAjax
        // difference is less 2000 set time out for 2000-difference 
        if (difference < 2000) {
            setTimeout(function () {
                $.mobile.loading('hide', {
                    theme: "e", text: "Bitte warten  ...", textonly: false,
                    textVisible: false
                });
            }, (2000 - difference));
        } else {
            // if time taken is greater than 2 second hide 
            $.mobile.loading('hide', {
                theme: "e", text: "Bitte warten  ...", textonly: false,
                textVisible: false
            });
        }

    };
    //start timer 
    let timeBeforeAjax = new Date();
    //show loader 
    $.mobile.loading('show', {
        theme: "e", text: "Bitte warten  ...", textonly: false,
        textVisible: false
    });
    //make ajax call
    $.ajax({
        success: function (data) {
            hideLoader(timeBeforeAjax);
            // logic on scucess
        },
        error: function (error) { //same logic as success.
            hideLoader(timeBeforeAjax);
            //logic on error
        }
    })

如何将jQuery Mobile loader延迟2秒？

1 个答案: