首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在ajax中调用spinner.gif调用grails中的加载时间

在 Grails 中,使用 AJAX 调用时,可以在加载过程中显示一个 spinner.gif 图片。为了实现这个功能,可以在 GSP 页面中添加一个图片元素,并在 AJAX 请求开始时显示它,请求完成时隐藏它。

首先,在 GSP 页面中添加一个图片元素,如下所示:

代码语言:html
复制
<img id="spinner" src="${resource(dir: 'images', file: 'spinner.gif')}" style="display:none">

这个图片元素的 ID 是 "spinner",它的样式设置为 "display:none",这样它最初是隐藏的。

接下来,在 AJAX 请求开始时显示 spinner,请求完成时隐藏它。可以使用 jQuery 的 AJAX 方法来实现这个功能,如下所示:

代码语言:javascript
复制
$(document).ready(function() {
  $('#myButton').click(function() {
    $('#spinner').show(); // 显示 spinner
    $.ajax({
      url: '/myController/myAction',
      type: 'POST',
      data: {
        // 请求参数
      },
      success: function(data) {
        // 处理请求成功的情况
      },
      error: function(xhr, status, error) {
        // 处理请求失败的情况
      },
      complete: function() {
        $('#spinner').hide(); // 隐藏 spinner
      }
    });
  });
});

在这个例子中,当用户点击 ID 为 "myButton" 的按钮时,会发送一个 AJAX 请求到 "/myController/myAction" 这个 URL。在请求开始时,会显示 ID 为 "spinner" 的图片元素。请求完成后,无论请求成功还是失败,都会隐藏 spinner。

需要注意的是,在 AJAX 请求中,可能会出现一些错误,例如网络错误、服务器错误等。因此,在处理请求失败的情况时,需要进行适当的错误处理,例如显示错误信息、重试请求等。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

18分42秒

029_尚硅谷react教程_回调ref中调用次数的问题

14分25秒

062_第六章_Flink中的时间和窗口(二)_水位线(三)_水位线在代码中的生成(一)

8分48秒

063_第六章_Flink中的时间和窗口(二)_水位线(三)_水位线在代码中的生成(二)

13分33秒

React基础 组件核心属性之refs 3 回调ref中调用次数的问题 学习猿地

10分42秒

day12_面向对象(中)/20-尚硅谷-Java语言基础-虚拟方法调用的再理解

10分42秒

day12_面向对象(中)/20-尚硅谷-Java语言基础-虚拟方法调用的再理解

10分42秒

day12_面向对象(中)/20-尚硅谷-Java语言基础-虚拟方法调用的再理解

13分58秒

day28_反射/26-尚硅谷-Java语言高级-调用运行时类中的指定属性

12分59秒

day28_反射/27-尚硅谷-Java语言高级-调用运行时类中的指定方法

13分58秒

day28_反射/26-尚硅谷-Java语言高级-调用运行时类中的指定属性

12分59秒

day28_反射/27-尚硅谷-Java语言高级-调用运行时类中的指定方法

13分58秒

day28_反射/26-尚硅谷-Java语言高级-调用运行时类中的指定属性

领券