gpt4 book ai didi

javascript - JQuery - 为什么 JQuery 动画是同步的?

转载 作者:行者123 更新时间:2023-11-30 10:05:29 25 4
gpt4 key购买 nike

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#a").hide(1000);
$("#b").hide(1000);
$("#c").hide(1000);

});
</script>
</head>
<body>

<p id="a">Paragraph 1</p>
<p id="b">Paragraph 2</p>
<p id="c">Paragraph 3</p>


</body>
</html>

Javascript 是单线程的,所以我认为函数是一个一个执行的。但在上面的示例中,这三个段落似乎同时开始并同时结束了hide 动画,就好像三个线程各自运行一个不同的动画一样。为什么动画不一个一个运行?

最佳答案

认为是和jquery这部分有关

jQuery.timers = [];
jQuery.fx.tick = function() {
var timer,
i = 0,
timers = jQuery.timers;

fxNow = jQuery.now();

for ( ; i < timers.length; i++ ) {
timer = timers[ i ];
// Checks the timer has not already been removed
if ( !timer() && timers[ i ] === timer ) {
timers.splice( i--, 1 );
}
}

if ( !timers.length ) {
jQuery.fx.stop();
}
fxNow = undefined;
};

jQuery.fx.timer = function( timer ) {
jQuery.timers.push( timer );
if ( timer() ) {
jQuery.fx.start();
} else {
jQuery.timers.pop();
}
};

jQuery.fx.interval = 13;

jQuery.fx.start = function() {
if ( !timerId ) {
timerId = setInterval( jQuery.fx.tick, jQuery.fx.interval );
}
};

jQuery.fx.stop = function() {
clearInterval( timerId );
timerId = null;
};

jQuery.fx.speeds = {
slow: 600,
fast: 200,
// Default speed
_default: 400
};

如你所见

setInterval( jQuery.fx.tick, jQuery.fx.interval );

那是非“阻塞”的 js

关于javascript - JQuery - 为什么 JQuery 动画是同步的?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29390371/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com