Harici jQuery Dosyasındaki Kodlar Çalışmıyor - jQuery


jQuery kütüphanesi ve harici javascript dosyası çağırılmasına rağmen jQuery kodlarının çalışmaması ile ilgili bir durumu ve çözümünü anlatan bir yazıdır.

Senaryo

Aşağıdaki dosyalar çalışmamaktadır.

index.html


<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>JQuery</title>
	<script type="text/javascript" src="js/jquery-2.2.0.min.js"></script>
	<script type="text/javascript" src="js/depo.js"></script>
</head>
<body>
	<!--Tıklandığında p etiketi gizleniyor.-->
	<p onclick="$(this).hide();">Deneme</p> <!--Çalışıyor. -->
	<p id="paragraf">Deneme2</p>            <!--Çalışmıyor.-->
	
</body>
</html>

dosya.js


$("#paragraf").click(function() {
	$("#paragraf").hide();
});

Çözüm

Sıkıntı jQuery tanımlanması ile alakalı bir sıkıntıymış. Aslında bir yazım hatası vs. yok ama kodlar hemen çalışmaya başlıyor ve bu arada kodların bir an önce işini bitirecek şekilde çalışmasından kaynaklı olarak bir şeyler kaçabiliyor. Bu yüzden devreye document.ready(); kodunu da sokmak gerekiyor. Böylelikle çalışma esnasında tanımlama kesin olarak yapılacak ve dosyadaki kodlar da çalışabilecek.


$(document).ready(function(){
	$("#paragraf").click(function() {
		$("#paragraf").hide();
	})
});

Yararlanılan Kaynaklar
Etiketler
jquery