2016-05-29 86 views
1
<button> Show </button> 
<ol style="display:none;"> 
<?php foreach ($this->getItems() as $_item): ?> 
    <li> 
     <?php if ($_item->getCount() > 0): ?> 
      <a href="<?php echo $this->urlEscape($_item->getUrl()) ?>"> 
       <?php echo $_item->getLabel() ?> 
       <?php if ($this->shouldDisplayProductCount()): ?> 
       <span class="count">(<?php echo $_item->getCount() ?>)</span> 
       <?php endif; ?> 
      </a> 
     <?php else: ?> 
      <span> 
       <?php echo $_item->getLabel(); ?> 
       <?php if ($this->shouldDisplayProductCount()): ?> 
        <span class="count">(<?php echo $_item->getCount() ?>)</span> 
       <?php endif; ?> 
      </span> 
     <?php endif; ?> 
    </li> 
<?php endforeach ?> 
</ol> 

我有以下代碼打印magento中的過濾器我想顯示/隱藏過濾器。這會從過濾器打印多次按鈕 - > ol過濾器按鈕 - > ol。我想這樣做:當我點擊按鈕時,我只想要第一個ol按鈕後顯示或隱藏。我需要幫助謝謝!JQUERY每個按鈕之後的第一個元素

+0

刪除'php'代碼,只寫html結果。 – Mohammad

回答

1

使用next()方法來選擇立即啓動以下同級

$('button').click(function() { 
 
    $(this) 
 
    .next() // get immediately next sibling 
 
    .toggle(); // toggle the visible states 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<button>Show</button> 
 
<ol style="display:none;"> 
 
    <li>list 
 
    <li> 
 
</ol> 
 
<button>Show</button> 
 
<ol style="display:none;"> 
 
    <li>list 
 
    <li> 
 
</ol> 
 
<button>Show</button> 
 
<ol style="display:none;"> 
 
    <li>list 
 
    <li> 
 
</ol> 
 
<button>Show</button> 
 
<ol style="display:none;"> 
 
    <li>list 
 
    <li> 
 
</ol>

+0

謝謝,這項工作,但我怎麼也可以在第二次點擊後隱藏。 –

+0

@ИванЖелев:使用切換,更新 –

1

作爲替代品使用jQuery的next()您還可以通過的div標籤包裝巴頓和011對。這樣當需要在Button和Ol之間添加一些標記時,JS代碼仍然可以工作。

<div class="filters-box"> 
    <button>...</button> 
    <ol>...</ol> 
</div> 

然後加入單擊事件是這樣的:

一點點的代碼,但它是更有彈性,以在需要延長。這樣的包裝也可以用於定位元件。不要讓臭名昭着的「分裂」脫離這個問題。

相關問題