隱藏div高一些

在我的屏幕左側我有一個索引。如果您單擊此索引的項目，它將顯示頁面右側的內容。如果您單擊幾個索引項目，則將顯示屬於這些索引的所有信息。這對用戶來說可能有點壓倒性，所以我希望用戶能夠關閉右側的一些部分。因此，我在右側顯示的每個部分都添加了一個按鈕。不幸的是，它不能按預期工作。隱藏div高一些

我有我的html頁面的一個片段：

<div class="col-md-8"> 
<div class="panel panel-default" id="SUPL106"> 
    <div class="close-btn-panel"> 
    <button type="button" class="close-btn" id="close-btn-SUPL106" aria-hidden="true"></button> 
    </div>  
    <div class="panel-heading"><h3>header</h3></div> 
    <div class="panel-body" > 
    <pre>some-text.</pre> 
    </div> 
    <h3 class="bg-primary"> <img src="cucumber-logo.png" width="32" height="30">Sub Header</h3> 
    <p> Some more text here</p> 
</div> 
<div class="panel panel-default" id="SUPL106" style="display: none;"></div> 
<div class="panel panel-default" id="SUPL106_1"></div> 
<div class="panel panel-default" id="SUPL106_1" style="display: none;"></div> 
<div class="panel panel-default" id="SUPL106_2"></div> 
<div class="panel panel-default" id="SUPL106_2" style="display: none;"></div> 
...

當clikcing按鈕，我想用ID SUPL106關閉父DIV。棘手的部分是，我有這樣一個按鈕在任何div看起來像：

<div class="panel panel-default" id="SUPL106">

其中id有不同的唯一值。

我創建了一個javascript/jquery函數來處理點擊按鈕。該腳本是：

$(document).ready(function() { 
    $('button.close-btn').click(function() { 
    var container = $('this').closest('div').closest('div'); 
    if(container.eq($('.panel-default'))) { 
     $(container).toggle(200); 
     alert("hello"); 
    } 
    return false; 
    }); 
});

此javascript顯示我的警報，所以我認爲它應該工作。雖然div沒有隱藏自己。問題是，如果我將eq（）中的值更改爲完全愚蠢的東西，它仍然會向我顯示警報。

我一直在爲此工作幾天，似乎無法找到適當的解決方案。

有什麼建議嗎？

來源

2016-01-21 Werner van Mook

你有2'div's與同'id'（'SUPL106'）。 –

，以獲得有效的HTML標記刪除重複的ID ...那麼它應該是：

$(document).ready(function() { 
    $('button.close-btn').click(function() { 
    $(this).closest('.panel-default').toggle(200); 
    return false; 
    }); 
});

來源

2016-01-21 14:13:01

是的，固定它。在我發現我必須刪除單詞上的引號後：謝謝。 –

@WernervanMook所以請考慮將其標記爲答案，以便問題將被關閉 –

隱藏div高一些

回答

相關問題