Question

我是初学者并且已经关注博客，请将等待动画的GIF添加到我的测试页面。效果很好。

博客说明将以下代码添加到表单按钮以触发请等待动画gif：

onclick="ShowProgressAnimation();"

如果有一个页面和一个按钮，开发人员想要通过调用服务器来触发请等待动画gif，这样就可以了。

如果网站在每个表单上都有40个页面和10个按钮，该怎么办？开发人员是否可以将上述代码添加到每个页面上的每个按钮？这似乎很多工作。

是否有全局jquery函数会在每次用户调用服务器以获取整个站点的操作时触发请等待动画gif？

Answer 1

如果您正在讨论ajax请求，那么您可以使用ajaxStart()和ajaxStop()个事件

$(document).ajaxStart(function () {
    //show gif
});

$(document).ajaxStop(function () {
    //hide gif
});

Answer 2

为所有按钮指定一个班级名称。然后使用该类触发一个显示进度gif的常用函数。

假设您有10个页面的10个按钮：

<input type="button" id="button1" class="showprogress" value="Click">

<input type="button" id="button2" class="showprogress" value="Click">

<input type="button" id="button3" class="showprogress" value="Click">

jQuery将是：

//This code should go in the head tag, between script tags
$(document).ready(function(){
    $('.showprogress').on('click', function(e){
        //Show the gif image
        //Do the processing
    });
});

Answer 3

尝试使用类似下面的类

HTML CODE

<button id="one" class="btn">ADD</button>
<button id="two" class="btn">DELETE</button>
<button id="three" class="btn">UPDATE</button>

JAVASCRIPT CODE

$('.bnt').click(function(){
    // code to show your progress animation goes here
})

您只需添加class btn 即可显示进度动画

JQuery - 发送服务器请求时的全局函数调用

3 个答案: