如何显示GIF图像，而在asp.net的MVC使用jQuery插件的形式上传 [英] how to show gif image while uploading using jquery form plugin in asp.net mvc

问题描述

我使用jQuery插件的形式为

I have file upload using jquery form plugin as

$(function() {

        $("#Form").ajaxForm({
            iframe: true,
            dataType: "json",
            url: "Upload/Index",
            success: function(result) {
                $('#MyGrid').append('<tr><td><a href="#">result</a></td></tr>');

            },
            beforeSubmit: function() {

            },
            error: function(response) {
                alert('error');
            }
        });
    });

和我的形式

<form id="Form" method="post" enctype="multipart/form-data">
<br />
    <input type="file" name="addedFile" id="addedFile"  />
    <br />
<input type="submit" id="submit" value="submit" runat="server" />
</form>

现在我想告诉加载GIF图像从用户点击提交按钮，我拿导致成功的功能。我怎么能做到这一点。

Now i want to show loading gif image from user clicks submit button to till i get result to success function. how can i do that .

感谢，

michaeld

推荐答案

您只需插入 IMG 元素插入DOM（我假定这将走在 beforeSubmit 功能）：

You can just insert an img element into the DOM (I assume this would go in the beforeSubmit function):

// doesn't have to be added to the body;
// wherever you want it is cool
$('<img id="loadingGif" src="path/load.gif" />').appendTo('body');

然后，你可以使用CSS来绝对定位，或其他任何你想要做的。

Then you can just use CSS to position it absolutely or whatever else you'd like to do.

然后，在错误或成功，您可以删除图片：

Then, on error or success, you can remove the image:

$('#loadingGif').remove();

您可以把它一点点更有效率只有建立元一次，然后简单地添加/从DOM移除，但是这是一个基本的开始。

You could make it a little more efficient by only building the element once, and then simply adding/removing from the DOM, but this is a basic start.

这篇关于如何显示GIF图像，而在asp.net的MVC使用jQuery插件的形式上传的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！