Question

我正在将一个类应用于谷歌地图，然后立即运行一个功能。函数完成后，将删除该类。

在某些移动浏览器上，我有时会看到该类没有删除，我猜测正在添加的类仍在完成。

有没有办法可以保证在开始我的功能之前已经应用了这个类？我可以添加一个计时器，这似乎有效，但有更好的方法吗？

我的代码类似于：

$('#map').addClass('fade-map');

function doStuff() {
       ...
    }

$('#map').removeClass('fade-map');

Answer 1

除非您引入超时或创建事件侦听器，否则块中的Javascript函数将按照控制流的顺序运行而不会中断。

看起来你的doStuff可能包含一些动画功能。大多数jQuery动画函数的参数是动画循环完成后运行的回调。

请参阅相关的documentation页面。

希望这会有所帮助：

$('#map').addClass('fade-map');

// --- doStuff
// .animate( properties [, duration ] [, easing ] [, complete ] )
$('#map').animate(
    {opacity:0},
    function(){
        $('#map').removeClass('fade-map');
    }
);

Answer 2

尝试（此模式）

var map = $('#map');
$.when(map.addClass("fade-map").data("on", true))
.done(function(_map) {
    function  doStuff() {
        // do stuff , 
        // e.g. , 
        // _map.text(_map.data("on")).animate({fontSize:"24px"}, 5000, "linear");
        _map.data("on", false);
    };
    // if _`map` (`$("#map")`) has class `fade-map` , do sutff
    if (_map.is(".fade-map") && _map.data("on") === true) {
      doStuff();
    }
})
.always(function(_map) {
     if (_map.is(".fade-map") && _map.data("on") === false) {
       // remove class , do stuff
      _map.removeClass("fade-map").append("\n" + _map.data("on"));
      console.log(_map.is(".fade-map"));
    }
});

jsfiddle http://jsfiddle.net/guest271314/h27o58ft/

请参阅jQuery .is()

Answer 3

JS以顺序方式执行，这意味着将始终首先应用类，然后执行函数，然后删除类。那说：

 $('#map').addClass('fade-map');

    var t = setInterval(function(){
      if($('#map').hasClass('fade-map')){
        /*execute your other function here - THIS BETTER NOT HAVE TIMEOUTS/INTERVALS OF
 IT's OWN or you'll see the same behavior. As someone below said in case you do have 
animations or stuff like that, you should remove class in a callback function of the animation*/
        $('#map').removeClass('fade-map');
        clearInterval(t);
      }
    },100);

这是一种令人讨厌的方式。

回调示例：

$('#map').addClass('fade-map').animate({'property1':'valueX'},function(){$(this).removeClass('fade-map')});

jQuery - 在删除之前等待类的应用

3 个答案: