jQuery: Burada

Question

çalışmıyor benim HTML

<div class="records" id="1"> 
     <div class="controls"> 
      <a class="special"> 
       <img class="1" src="special1.png" class="shown" /> 
       <img class="1" src="special0.png" class="hidden" /> 
      </a> 
     </div> 
</div> 

<div class="records" id="2"> 
     <div class="controls"> 
      <a class="special"> 
       <img class="1" src="special1.png" class="hidden" /> 
       <img class="0" src="special0.png" class="shown"/> 
      </a> 
     </div> 
</div> 

O db alınır ne HTML çıktı olmasıdır. Ancak bir kerede, görüntülerden yalnızca biri bir kayıtta ya special1.png ya da special0.png olarak gösterilir, ancak kullanıcı herhangi bir a.special tıklandığında bu kaydın special1.png görünmesini ve diğer a.special görüntülerinin yalnızca special0.png görüntülemesi gerekir. Bunun için ben bu .not() yöntemi denemeye değer olacağını bu

$(".controls a").click(function() { 
    var action = $(this).attr('class'); 
    var id = $(this).parent(".controls").parent(".records").attr('id'); 

    //Now send post request and database things 
    //function(data) { //After this stage 
     $(this).children("img.1").show(); //show the active image 
     $(this).children("img.0").hide(); //hide the inactive image 

    //However this below I used :not to skip current element but it doesn't, it hides all inactive image and shows all active images 

     $("div:not(#"+id+") a.special img.1").hide(); //hide all the active image except this one 
     $("div:not(#"+id+") a.special img.0").show(); //show all the in-active image except this one 

    // } // 
}); 

Answer 1

kullanarak bunu yapmak için çalıştı. Seçicinizi daha temiz hale getirir ve daha fazla yetenek kazandıran argüman olarak işlev görebilir. Ayrıca

, ben zaten belirttiğimiz gibi - HTML4 Kimliği en a> bir harf ile başlamalıdır AZ veya az
b> takip edilebilir: harfler (A-Za-z), rakamlar (0-9) , tire ("-"), alt çizgi ("_"), iki nokta üst üste (":") ve noktalardan (".")

Answer 2

Bu sorunun :not olduğunu düşünmüyorum.

İlk div numaralı belgede, her iki görüntünün de class="1" olduğunu görürsünüz. Bu sorun olabilir. Bir görüntü için class="0" ayarlamayı deneyin.

Answer 3

İlk olarak, HTML4'de izin verilmeyen numaralar kullandığınızdan, :not() başarısız olduğunu düşünüyorum. Tüm id öznitelikleri, bir alfabetik karakterle başlamalıdır. Bunları, örneğin, r ile kimlikleri öneki olabilir:

<div class="records" id="r1"> 

İkinci olarak, bu çok daha verimli .not yöntemi kullanarak yapabilirsiniz:

$(".controls a").click(function() { 
    var action = this.class; 
    var record = $(this).closest(".records")[0]; // get the DOM element of the ancestor .records 

    //Now send post request and database things 
    //function(data) { //After this stage 
     $(this).children("img.r1").show(); //show the active image 
     $(this).children("img.r0").hide(); //hide the inactive image 

     $("div").not(record).find("a.special img.r1").hide(); //hide all the active image except this one 
     $("div").not(record).find("a.special img.0").show(); //show all the in-active image except this one 

    // } // 
}); 

Not

• this.class kullanımı $(this).attr('class')
• .closest('.records') ürününün f ind sınıfa records
• [0] ile yakın atası eleman
• .find() belirli seçici

eşleşen tüm soyundan elemanlarını bulmak için

.not(record) kümesinden record elemanını kaldırmak için jQuery seçimden DOM öğesine almak