jQuery - birden fazla $ (belge). zaten…?


359

Soru:

Her ikisi de $(document).readyişlevli iki JavaScript dosyasına bağlanırsam ne olur? Biri diğerinin üzerine yazıyor mu? Yoksa her ikisi de $(document).readyaranır mı?

Örneğin,

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script type="text/javascript" src="http://.../jquery1.js"></script>

<script type="text/javascript" src="http://.../jquery2.js"></script>

jquery1.js:

$(document).ready(function(){
    $("#page-title").html("Document-ready was called!");
});

jquery2.js:

$(document).ready(function(){
    $("#page-subtitle").html("Document-ready was called!");
});


Her iki çağrıyı tek bir telefona birleştirmenin en iyi yöntem olduğuna eminim, $(document).readyancak benim durumumda pek mümkün değil.


Yanıtlar:


352

Tüm idam edilecek ve İlk denilen ilk çalıştırma esasına göre !!

<div id="target"></div>

<script>
  $(document).ready(function(){
    jQuery('#target').append('target edit 1<br>');
  });
  $(document).ready(function(){
    jQuery('#target').append('target edit 2<br>');
  });
  $(document).ready(function(){
    jQuery('#target').append('target edit 3<br>');
  });
</script>

Demo Gördüğünüz gibi birbirlerinin yerini almıyorlar

Ayrıca bahsetmek istediğim bir şey var

bunun yerine

$(document).ready(function(){});

bu kısayolu kullanabilirsiniz

jQuery(function(){
   //dom ready codes
});

66
hatta daha kısa $ (function () {// dom hazır kodları}); api.jquery.com/ready
davehale23

217
$ (Function () {// do stuff}) 'ı görmeyi unutmayın; İlk kez ve açıklama Google için ne kadar zor oldu? $ (belge). zaten çok az şey için çok daha fazla iletişim kuruyor ...
Matt Montag

56
Kısa, daha az okunabilir kod için bir oylama, terörizm için bir oylamadır.
FreeAsInBeer

10
Kısayollar hiçbir fayda sağlamaz, ancak şaşkınlığa neden olur. Amacınız, kodunuzu okumak, anlamak ve bakımını yapmak için geçen süreye göre "kısaltmak" ise, bu kısayollar size çok yol gösterir.
jononomo

3
kısayollar kullanmak jQuery(document).ready(function(){ });
Memet Olsen

76

Her jQuery()aramanın gerçekten geri dönmesi gerektiğini unutmamak önemlidir . Bir istisna atılırsa, sonraki (alakasız) çağrılar hiçbir zaman yürütülmez.

Bu sözdizimine bakılmaksızın uygulanır. Sen kullanabilirsiniz jQuery(), jQuery(function() {}), $(document).ready(), ne gibi aynı davranıştır. Erken bir başarısız olursa, sonraki bloklar asla çalıştırılmaz.

Üçüncü taraf kütüphaneler kullanılırken bu benim için bir sorundu. Bir kütüphane istisna atıyordu ve sonraki kütüphaneler hiçbir şey başlatmadı.


2
Bu. Bu noktaya kadar bir konuyu daraltmak için iyi bir saat geçirdim. $(document).readyÇağrılarımdan biri hata verdi ve bu nedenle farklı bir $(document).readyişlev hiç çağrılmadı. Beni deli ediyordu.
scroll

10
Artık durum böyle değil. JQuery 3.0'dan itibaren, jQuery bir işleyicide oluşan bir özel durumun daha sonra eklenen işleyicilerin yürütülmesini engellememesini sağlar. api.jquery.com/ready
Ravi Teja

32

.ready $ (document) (); diğer işlevlerle aynıdır. belge hazır olduğunda (yani yüklendiğinde) tetiklenir. soru, aynı işlevi birden fazla $ (belge) .ready () 'in içinde başlatmazsanız, birden fazla $ (belge) .ready ()' in tetiklendiğinde ne olacağı ile ilgilidir.

//this
<div id="target"></div>

$(document).ready(function(){
   jQuery('#target').append('target edit 1<br>');
});
$(document).ready(function(){
   jQuery('#target').append('target edit 2<br>');
});
$(document).ready(function(){
   jQuery('#target').append('target edit 3<br>');
});

//is the same as
<div id="target"></div>

$(document).ready(function(){

    jQuery('#target').append('target edit 1<br>');

    jQuery('#target').append('target edit 2<br>');

    jQuery('#target').append('target edit 3<br>');

});

her ikisi de aynı şekilde davranacaktır. tek fark, ilkinin aynı sonuçları elde etmesine rağmen. ikincisi saniyenin bir kısmını daha hızlı çalıştırır ve daha az yazmayı gerektirir. :)

sonuç olarak mümkün olan her yerde yalnızca 1 $ (belge) .ready () kullanın;

// eski cevap

İkisi de sırayla çağrılır. En iyi uygulama onları birleştirmek olacaktır. ama mümkün değilse endişelenme. sayfa patlamaz.


^ ^ insanlar aynı işlevi birden çok kez çalıştırmak ve birden fazla $ (belge) farklı fonksiyonları çalıştırmak arasında karışık olabilir düşündüğüm gibi benim mayın düzenledi. zaten's. ^ ^ umarım yardımcı olur.
Ed Fryed


10

Her ikisi de aranacak, önce gelen ilk hizmet. Buraya bir bak .

$(document).ready(function(){
    $("#page-title").html("Document-ready was called!");
  });

$(document).ready(function(){
    $("#page-title").html("Document-ready 2 was called!");
  });

Çıktı:

Doküman hazır 2 çağrıldı!


2

Bir iş parçacığı necro için değil, ancak jQueryönerilen sözdiziminin en son sürümü altında :

$( handler )

Anonim bir işlev kullanıldığında, bu

$(function() { ... insert code here ... });

Bu bağlantıya bakın:

https://api.jquery.com/ready/

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.