Bir sınıf eklemek, 2 saniye beklemek ve başka bir sınıf eklemek istiyorum.
.addClass("load").wait(2sec).addClass("done");Herhangi bir yol var mı?
Bir sınıf eklemek, 2 saniye beklemek ve başka bir sınıf eklemek istiyorum.
.addClass("load").wait(2sec).addClass("done");Herhangi bir yol var mı?
Yanıtlar:
setTimeout, belirli bir süre geciktikten sonra (milisaniye cinsinden ölçülür) bazı kodları çalıştırır. Bununla birlikte, önemli bir not: javascript'in doğası gereği, kodun geri kalanı zamanlayıcı kurulduktan sonra çalışmaya devam eder:
$('#someid').addClass("load");
setTimeout(function(){
$('#someid').addClass("done");
}, 2000);
// Any code here will execute immediately after the 'load' class is added to the element.
Olurdu .delay().
Eğer AJAX işi yapıyorsanız, gerçekten sadece otomatik olarak "bitti" yazmamalısınız, gerçekten bir yanıt beklemeli ve gerçekten yapılıp yapılmadığını görmelisiniz.
.removeClass('load')aksi takdirde her iki sınıfı da eklemenizi istersiniz , bu muhtemelen istenmeyen bir durumdur. Gerçekten eşzamansız bir eylemin tamamlanmasını bekliyorsanız, en iyi bahsiniz tamamlandığında ve başarılı olduğunda .addClass yapmaktır, eğer .addClass değilse ('hata') bir fikir olabilir
delay () işi yapmaz. Delay () ile ilgili sorun, animasyon sisteminin bir parçasıdır ve yalnızca animasyon kuyrukları için geçerlidir.
Ya animasyonun dışında bir şey yürütmeden önce beklemek isterseniz ??
Bunu kullan:
window.setTimeout(function(){
// do whatever you want to do
}, 600);
Ne olur ?: Bu senaryoda, kaşlı ayraçlar içinde belirtilen kodu çalıştırmadan önce 600 milisaniye bekler.
Bu, çözdüğümde bana çok yardımcı oldu ve umarım sana da yardımcı olur!
ÖNEMLİ UYARI: 'window.setTimeout' eşzamansız olarak gerçekleşir. Kodunuzu yazarken bunu aklınızda bulundurun!
Bunun eski bir soru olduğunu anlayın, ancak bu sorunu çözmek için birisinin yararlı bulabileceği bir eklenti yazdım.
https://github.com/madbook/jquery.wait
bunu yapmana izin ver:
$('#myElement').addClass('load').wait(2000).addClass('done');Bir işlev var, ancak fazladan: http://docs.jquery.com/Cookbook/wait
Bu küçük parça beklemenizi sağlar:
$.fn.wait = function(time, type) {
time = time || 1000;
type = type || "fx";
return this.queue(type, function() {
var self = this;
setTimeout(function() {
$(self).dequeue();
}, time);
});
};
.delay()Fonksiyonu kullanabilirsiniz .
Peşinde olduğun şey bu:
.addClass("load").delay(2000).addClass("done");xml4jQuery eklentisi uyku (ms, geri arama) yöntemi verir. Kalan zincir uyku döneminden sonra yürütülecektir.
$(".toFill").html("Click here")
.$on('click')
.html('Loading...')
.sleep(1000)
.html( 'done')
.toggleClass('clickable')
.prepend('Still clickable <hr/>');.toFill{border: dashed 2px palegreen; border-radius: 1em; display: inline-block;padding: 1em;}
.clickable{ cursor: pointer; border-color: blue;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.xml4jquery.com/ajax/libs/xml4jquery/1.1.2/xml4jquery.js"></script>
<div class="toFill clickable"></div>SetTimeout işlevini kullanarak, örneğin burayı ziyaret edin