Question

我有一个asp.net表单。我想在提交表单时显示一个jquery进度图像，并且在后端发生了一些事情。

这是我的javascript：

<script language="javascript">
$(document).ready(function () {
    $('#progress').hide();
    $("#ProjectNavigation input.bgdiv").click(function () {            
        $("#progress").show();
        $("body").load($(this).attr('href'));
        return false;
    });
});

单击图像设置为“bgdiv”的图像正在显示动画gif（正如预期的那样），但是我希望在后端内容完成处理后隐藏gif（或者包含它的div）。不知道如何实现这一目标。我不确定这条线在我的javacsript中是否正确，因为我的html中没有href标签：$（“body”）。load（$（this）.attr（'href'））;

非常感谢任何提示。

这是我的标记：

<table id="ProjectNavigation" class="ProjectNavigation" width="100%">
<tr>
    <td>Title 1</td><td>Title 2</td><td>Title 3</td><td>Title 4</td>
</tr>
<tr>
    <td class="HelpGuidanceLink">Comments
        <div id="progress" style="padding:20px 0 0 35px;">
            <img src="/_layouts/images/progress-image.gif">
        </div>
    </td>
    <td colspan="3">
        <textarea name="CommentsTextBox" rows="3" cols="20" id="CommentsTextBox" class="ProjectGuideTextBox">
            other comments testing...
        </textarea>
    </td>
</tr>    
<tr>        
    <td colspan="4">
        <input type="image" name="PreviousPhaseImageButton" id="PreviousPhaseImageButton" class="bgdiv" src="/images/previous-phase-arrow.png" />
        <input type="image" name="NextPhaseImageButton" id="NextPhaseImageButton" class="bgdiv" src="/images/next-phase-arrow.png" />            
    </td>    
</tr>

谢谢 -

Answer 1

.load()接受回调函数作为参数。在您的加载调用中添加一个函数作为第二个参数，隐藏进度条。

关于href，看起来你是对的 - 它不会按原样运行。您需要告诉jQuery要加载的URL。我最自然地在input的value属性中指定它并使用.val()检索它。

$("body").load($(this).val(), function (responseText, textStatus, XMLHttpRequest) {
    $('#progress').hide();
});

这是working demo at jsfiddle。

在处理后台任务或提交表单时显示进度图像

1 个答案: