綁定點擊函數div JQuery的

我需要點擊功能綁定在這個排序列表中的每個格爲了使隱藏/顯示每個imgXX格的圖像，我是新手用jQuery綁定點擊函數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>

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); 
       } 
    }); 
});

來源

2010-09-08 Felix

那麼，什麼讓你悲傷？嗯...（$（this）.find（'img'）。is（'：visible'）。長度不正確，我認爲is（）會給你一個真正的假，應用長度可能會很奇怪。 – 2010-09-08 05:59:52

@Sidhart你說得對，應該是'find（'img：visible'）' – alex 2010-09-08 06:06:40

請注意，你綁定了嵌套的div元素上的click事件，所以它們可能會觸發兩次，你可能想用'$（' div.img'）''''或'$（'div.star'）'選出一組div元素，並且'.each（function（）{$（this）.click（...）;}） ''可以縮短爲'.click（...）'，因爲它將事件應用於集合中的所有元素。 – Guffa 2010-09-08 06:12:23

is方法返回一個布爾值。用途：

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

或：

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

來源

2010-09-08 06:07:23 Guffa

很棒的節省時間 – 2014-07-30 06:42:04

試試這個：

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

來源

2010-09-08 06:03:18

不像其他過濾和遍歷方法，.is（）不會創建一個新的jQuery對象。相反，它允許我們在不修改的情況下測試一個 jQuery對象的內容。

來源：http://api.jquery.com/is/

所以，你不能用它的長度，它返回一個布爾值。刪除'長度'，它應該工作。

來源

2010-09-08 06:05:04 Vikash

我不認爲你一定需要在每個。

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

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

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

});

來源

2010-09-08 06:13:21 Newtang

這工作正常？ – kubudi 2012-03-07 21:35:24

不知道有關的div的嵌套，而是因爲你是請求僅褪色img我假設.star DIV是可見的，可點擊。下面的函數更有效一些，因爲我使用的是children而不是find，它是遞歸的。除了選擇器這應該爲你工作。

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

來源

2010-09-08 06:14:11

綁定點擊函數div JQuery的

回答

相關問題