Merhaba arkadaşlar,
Öncelikle belirtmeliyim ki ben each'i zor öğrendim yani anlamamak ve kullanmamak için kendimi zorladım ama baktım ki çok işe yarıyor öğrendim. each karışık durabilir ama gerçekten çok kolay.
Bugün pek yazı yazma isteğim yok o yüzden direk anlatıma geçiyorum. (Her eklentimde önce internette resim aramaktan ve bulamayıp kendi resimlerimi kullanmaktan bıktım. Yakında lipsum'un resimlisini yapacağım!)
Each = foreach döngüsü olarak düşünün, tek farkı ise each elementlerin toplamini kendi aliyor ve hepsini tek tek işliyor.
Kodların içerisinde anlatımları mevcuttur.
Uygulamayı indir Uygulama Ön izleme
Öncelikle belirtmeliyim ki ben each'i zor öğrendim yani anlamamak ve kullanmamak için kendimi zorladım ama baktım ki çok işe yarıyor öğrendim. each karışık durabilir ama gerçekten çok kolay.
Bugün pek yazı yazma isteğim yok o yüzden direk anlatıma geçiyorum. (Her eklentimde önce internette resim aramaktan ve bulamayıp kendi resimlerimi kullanmaktan bıktım. Yakında lipsum'un resimlisini yapacağım!)
Each = foreach döngüsü olarak düşünün, tek farkı ise each elementlerin toplamini kendi aliyor ve hepsini tek tek işliyor.
Kodların içerisinde anlatımları mevcuttur.
Kod:
/********************ornek1********************/
$('.ornek1Calistir').click(function(){//ornek1Calistir butonuna tiklanildiginda
$(this).attr('disabled','disabled');/*butonu iptal ediyoruz*/
$('.ornek1 ul li').each(function(i){/*li'leri dondur*/
$(this).prepend(i + '. element : ');/*Sira numaralarini yazdirdik*/
$(this).find('a').css('color','rgb('+ Math.floor(Math.random()*249)+','+ Math.floor(Math.random()*249)+','+ Math.floor(Math.random()*249)+')');/*rastgele renk urettik*/
$(this).find('a').css('font-size', Math.floor(Math.random()*40+20)); /*rastgele font buyuklugu urettik*/
if((i %2) == 0) /*Mod aliyoruz cift sayilara renk veriyoruz.*/
{
$(this).css('background','#f9f9f9');/*Değişik arkaplan veriyoru*/
}
});
});
Kod:
/********************ornek2********************/
$('.ornek2Calistir').click(function(){//ornek2Calistir butonuna tiklanildiginda
$(this).attr('disabled','disabled');/*butonu iptal ediyoruz*/
$('.ornek2 p').each(function(i){/*p'leri dondur*/
/*Resimleri sekillendiriyoruz*/
$(this).find('img').css({
width: '120px',
padding: '5px',
border: '3px solid #666',
margin : '5px',
display: 'block'
});
/*p tagina bir kac css ozelligi veriyoruz*/
$(this).css({
'width':'200px',
'overflow' : 'hidden',
'float':'left'
});
/*resim isimlerini alip resimin altina link olarakyazdiriyoruz*/
$(this).append('Resim Adi <br><a href="' + $(this).find('img').attr('src') + '" >' + $(this).find('img').attr('src') + '</a>')
});
});