प्रत्येक पर बाध्यकारी क्लिक समारोह JQuery

Question

div मैं क्रम में इस आदेश दिया सूची में से प्रत्येक div पर क्लिक समारोह बाध्य करने के लिए JQuery

साथ

<ol id='selectable'> 
<li class="ui-state-default"> 
    <div id="img01" class="img"> 
     <div id="star01" class="star"> 
      <img src="../ima/star.png" height="30px"/> 
     </div> 
    </div> 
</li> 
<li class="ui-state-default"> 
    <div id="img02" class="img"> 
     <div id="star02" class="star"> 
      <img src="../ima/star.png" height="30px"/> 
     </div> 
    </div> 
</li> 
</ol> 

छिपाने/प्रत्येक imgXX div पर एक छवि दिखाने के लिए, मैं नौसिखिया बनाने की जरूरत है

JQuery

$('div').each(function(){ 
    $(this).click(function(){ 
      if($(this).find('img').is(':visible').length){ 
        $(this).find('img').fadeOut(700); 
      } 
      else{ 
        $(this).find('img').fadeIn(700); 
       } 
    }); 
}); 

Answer 1

is विधि एक बूलियन देता है। उपयोग:

if($(this).find('img').is(':visible')) 

या:

if($(this).find('img:visible').length) 

Answer 2

इस प्रयास करें:

$('div').each(function(){ 
    $(this).click(function(){ 
      if($(this).find('img').is(':visible')){ 
        $(this).find('img').fadeOut(700); 
      } 
      else{ 
        $(this).find('img').fadeIn(700); 
       } 
    }); 
}); 

Answer 3

के विपरीत अन्य फ़िल्टरिंग और ट्रेवर्सल तरीकों, .is() एक नया jQuery वस्तु नहीं बनाता है। इसके बजाय, यह हमें बिना किसी संशोधन के jQuery ऑब्जेक्ट की सामग्री का परीक्षण करने की अनुमति देता है।

• स्रोत: http://api.jquery.com/is/

तो, आप के रूप में यह एक बूलियन मान देता है उस पर लंबाई का उपयोग नहीं कर सकते। 'लंबाई' निकालें और इसे काम करना चाहिए।

Answer 4

मुझे नहीं लगता कि यह आवश्यक नहीं है प्रत्येक की आवश्यकता है।

$('div').click(function(){ 

    var img = $(this).find('img'); 

    if($(img).is(':visible')){ 
    $(img).fadeOut(700); 
    } 

}); 

Answer 5

divs के घोंसले के बारे में सुनिश्चित नहीं हैं, लेकिन जब से तुम को अनुरोध कर रहे हैं केवल img फीका मैं यह सोचते हैं कि .star div दिखाई और क्लिक करने योग्य है। नीचे दिया गया कार्य थोड़ा अधिक कुशल है क्योंकि मैं children का उपयोग find के बजाय कर रहा हूं जो रिकर्सिव है। चयनकर्ताओं के अलावा यह आपके लिए काम करना चाहिए।

$('div.star').click(function() { 
    function() { 
     $(this).children('img').fadeOut(700); 
    }, 
    function() { 
     $(this).children('img').fadeIn(700); 
    } 
});