如何在执行提交表单时显示加载的gif均值 [英] How to show a loading gif mean while a submit form is being executed JQuery

问题描述

我正在尝试显示一个简单的微调器gif，同时正在执行提交(这需要一些时间，因为我必须通过Web服务与提供者建立一些通信).

I'm trying to show a simple spinner gif meanwhile a submit is being executed (it takes a bit because I have to establish some communications with providers via web services).

所以，我有这个:

$('#gds_form').submit(function() {
        var pass = true;
        //some validations

        if(pass == false){
            return false;
        }

        $("body").prepend('<div class="ui-widget-overlay" style="z-index: 1001;"></div>');
        $("body").prepend("<div id ='PleaseWait'><img src='/images/spinner.gif'/></div>");
        return true;
    });

问题是，.gif不显示任何动画，就像是冻结的一样.

the thing is, that the .gif doesn't show any animation, it's like it is frozen.

为什么?

还有另一种方法可以实现这一点(请注意，我不使用AJAX，并且我不想这样做)?

There's another way to implement this (notice that I'm not using AJAX and I don't want to)?

谢谢.

推荐答案

您是否尝试过将图像加载到文档中，而只是隐藏了图像.然后在您的函数中显示它?这样，图像已经加载并旋转.

Have you tried loading the image on document ready, only having it hidden. Then display it in your function? This way, the image is already loaded and spinning.

$(document).ready(function() {
    $("body").prepend('<div id="overlay" class="ui-widget-overlay" style="z-index: 1001; display: none;"></div>');
    $("body").prepend("<div id='PleaseWait' style='display: none;'><img src='/images/spinner.gif'/></div>");
});

$('#gds_form').submit(function() {
    var pass = true;
    //some validations

    if(pass == false){
        return false;
    }
    $("#overlay, #PleaseWait").show();

    return true;
});

这篇关于如何在执行提交表单时显示加载的gif均值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！