「唯一可見的孩子」元素？

我有一個大外的div用許多相同的圓（它是一個較小的DIV與邊界半徑100％）在它。「唯一可見的孩子」元素？

我正在使用jquery淡出這些圈子s當用戶點擊它們，但是我想添加額外的事件時，只剩下的圓圈被點擊。

：最後一個孩子或：第n個孩子（）是不會幫助，因爲我不介意被點擊的是哪個圈子，直到只是其中的一個保留。

同樣，元素淡出所以他們仍然是可見元素的兄弟姐妹。所以我需要的是選擇「最後可見」元素。

<div> 

<div class="circle"></div> 

<div class="circle"></div> 

<div class="circle"></div> 

<div class="circle"></div> 

<div class="circle"></div> 

<div class="circle"></div> 

<div class="circle"></div> 

<div class="circle"></div> 

</div>

$(document).ready(function(){ 
    $(".circle").click(function(){ 
     $(this).fadeOut("slow"); 
    }); 
    $("XXX").click(function(){ 
     alert("I was the last of Mohicans"); 
    }); 
});

來源

2013-01-07 mizurnix

向我們展示你的代碼...或的jsfiddle可能 – bipen

爲什麼不你向我們展示一些示例源代碼？幫助你會更容易。 – reporter

爲什麼不

.circle:first-child:last-child {

？

編輯編輯的問題：

如果你想測試一下的時候，如果該元素是唯一可見的，你可以這樣做：

$(document).ready(function(){ 
    $(".circle").click(function(){ 
     $(this).fadeOut("slow"); 
     if ($('.circle:visible').length>1) return; // returns if not the last one 
     alert("I was the last of Mohicans"); 
    }); 
});

來源

2013-01-07 12:11:13

當然，這對選擇唯一的孩子很好，但我的問題是不正確的，所以我編輯它。 – mizurnix

我使用解決方案編輯可視圓圈。 –

爲什麼你有'$（「。circle」）。click（function（）'兩次？我不知道這對jQuery是可能的嗎？ – Sean

的jQuery其實有一個only-child選擇，看到這裏：http://api.jquery.com/only-child-selector/

（希望我已經明白你在問什麼）

在編輯的問題，請參見下面的光：

也許你應該嘗試這樣的事：

$(document).ready(function(){ 
    $(".circle").click(function(){ 
     var numCircles = $('.circle').length; 
     var numFaded = $('.faded').length; 
     if((numCircles - numFaded) == 1) { 
      alert("I was the last of Mohicans!"); 
     } 
     $(this).fadeOut("slow"); 
     $(this).addClass("faded"); 
    }); 
});

我知道上面是不是最佳的可能（我不是的JavaScript/jQuery大師），但它應該是相當快的（只要你不添加大量循環），它應該按照你的需要運行。請記住，我沒有測試過上述內容，希望如果它不起作用，它應該至少讓您朝正確的方向發展，但如果您需要更多幫助，請在下面評論。

來源

2013-01-07 12:16:19 Sean

不知道這個，thx –

@dystroy 嗯，也許我的問題是不正確的。兩個答案都提供了一種有效的方法來選擇唯一的子元素，但是當我使用** fadeOut **時，元素仍然保留在HTML文件中，因此它們都不會成爲唯一的子元素。對不起，我以前不知道這一點。我會編輯該問題以避免進一步混淆。 – mizurnix

好吧，我明白了，我會修改我的回答 – Sean

解決方法是將額外的課程添加到這些div，並且只有孩子。當單擊$（「。extraclass：only-child」）時，添加新事件。否則刪除你的額外類並應用淡出效果。

來源

2013-01-07 12:55:45

$(document).ready(function() { 
    $(".circle").click(function() { 
    var $this = $(this); 
    $this.fadeOut("slow"); 
    if ($this.siblings(':visible').length === 0) { 
    alert("I was the last of Mohicans"); 
    } 
}); 
});

以可見的兄弟姐妹數將是最好的選擇... 如果你需要，你可以添加類選擇也..

來源

2013-01-07 12:57:57 Anujith

「唯一可見的孩子」元素？

回答

相關問題