刪除一個div，如果另一個爲空

我試圖讓一個div顯示另一個是否爲空。這需要在整個頁面中多次發生。該腳本不會在當前狀態下工作。刪除一個div，如果另一個爲空

腳本：

$('.standard_page_list_result').each(function(){ 

if ($('.children p').length == 0) 
    $('.summary').css("display", "block"); 

});

HTML：

<div class="standard_page_list_result"><div class="children"><p>Hello</p></div> 
<div class="summary"><p>Goodbye</p></div></div> 

<div class="standard_page_list_result"><div class="children"><p>Hello</p></div> 
<div class="summary"><p>Goodbye</p></div></div> 

<div class="standard_page_list_result"><div class="children"><p>Hello</p></div> 
<div class="summary"><p>Goodbye</p></div></div> 

<div class="standard_page_list_result"><div class="children"><p></p></div> 
<div class="summary"><p>Hello!</p></div></div>

CSS：

.summary { display: none; }

來源

2012-05-02 Jeremy Hewitt

使用你的相同概念，你需要確定一個你在this，然後做一個查找選擇器，以使其工作。你正在做的是獲得所有的長度。

$('.standard_page_list_result').each(function(){ 
    if ($(this).find('.children p').text().length == 0) 
     $(this).find('.summary').css("display", "block"); 
});

這裏是的jsfiddle你

http://jsfiddle.net/JoshuaPack/4C35E/

來源

2012-05-02 03:28:52

太棒了，非常感謝！並感謝所有人，stackoverflow peeps規則：D –

$('...').length會告訴你很多元素如何匹配你的選擇，如果沒有這些元素都是空的。

要檢查元素是空的，我可能會做這樣的：

if($.trim($(...).text()).length == 0)

最後，您需要使用您的this裏面的每個目標相應的元素。事情是這樣的：

$('.standard_page_list_result').each(function(){ 
    var $this = $(this); 

    if ($.trim($this.find('.children p').text()).length == 0){ 
     $this.find('.summary').css("display", "block"); 
    } 
});

http://jsfiddle.net/kzfGL/1/

來源

2012-05-02 03:22:00

而不是檢查<div>的長度使用is()功能嘗試。

$('.standard_page_list_result').each(function(){ 
    if($(this).find('.children p').is(':empty')) { 
     $(this).find('.summary').css("display", "block"); 
    } 
});

編輯：

固定上面的代碼來選擇的每個元素而不是影響所有元素如果只有1是空的。其他答案已經選擇，但對於未來的觀衆，這是使用is（）函數的替代方案。這是一個fiddle它。

注意：空檢查也沒有空白。如果只有一個空間，那麼它不是空的

來源

2012-05-02 03:22:11

謝謝@JT史密斯，這是工作。但在我提供的腳本中是否正確聲明瞭'each'參數？因爲如果第一個.child div是空的，頁面上的每個.summary div似乎都會顯示。 –

是的，包裝'each（）'函數對我來說似乎很好。當您使用我提供的內容更改長度測試時，它仍不起作用嗎？ –

檢查我的更新。這_should_ work –

只需撥動基於元素的空虛摘要：

$('.standard_page_list_result').each(function(){ 
    $('.summary', this).toggle($('.children p', this).is(":empty")); 
});

來源

2012-05-02 03:32:16

在一個行：

$('.standard_page_list_result .children p:empty').parent().next('.summary').css('display','block');

演示：http://jsfiddle.net/JXDNk/

來源

2012-05-02 03:33:18 stewe

+1這是一個偉大的方式來做到這一點！感謝您的貢獻。 –

刪除一個div，如果另一個爲空

回答

相關問題