javascript - jquery .attr() 类开关不起作用

Question

我正在开发一个网络服务，

当用户通过 ajax 请求更多数据时，我希望包含数据的 div 显示一个加载圆圈。当我想要圆圈时，我在样式文件中写了一个 css 类:

.ajax_getTeams_loading{

background: url('ajax-loader.gif') no-repeat center center;

 }

所以我的ajax函数是这样的:

        function(profile, divId){



    $('#' + divId).attr('class', 'goose');


    /*$.get('testGetTeams.php', {username: profile}, function(data) {
        $('#' + divId).html(data);
    });*/

}

问题是圆圈永远不会出现。我尝试将 css 类简化为背景颜色:蓝色，但这甚至没有用。我也完全删除了 ajax 部分，它仍然根本不起作用。我究竟做错了什么？

Answer 1

此时我没有看到您将“ajax_getTeams_loading”类添加到 div。但是，因为它是一个背景，所以如果 div 中有数据，您可能看不到它。然后它将位于文本下方或 div 中的任何内容。

最好用加载图标替换 div 中的任何内容，然后用新请求的数据替换加载图标。示例:

// store your div object in a variable,
// this is faster since you'll be using it multiple times
var div = $('#' + divId);

// replace the div's content with the loader
// you might want to add a width and height to the css
// to make sure the div is large enough to show the entire loading icon
var loader = '<div class="ajax_getTeams_loading"></div>';
div.html(loader);

$.get('testGetTeams.php', {username: profile}, function(data) {
  // replace the loader icon with the requested data
  div.html(data);
});