點擊事件過濾多個div中的鏈接/內容

Question

我目前正在努力篩選多個框內的多個內容。

• 我在頂部有與某些人的名字相關的鏈接/按鈕。
• 我也有一個側邊欄，具有不同的div，范圍從A到D（任意）。
• 在這些div中，我用不同的名稱

我要做的基本上是只在頂部單擊的人才能顯示在不同的div（A到D）中。 顯然可以點擊其他人並執行相同操作 此刻，第一次單擊似乎可以完成我想要的操作，但隨后的單擊卻沒有，一切都消失了。

我不知道該怎么辦。 該項目有許多不同類型的過濾器，但沒有一個給我帶來麻煩，但是這個項目...

  <div id="sidebar_wrapper">
<div class="sidebar_nav">
  <div class="name_icon_box">
    <a href="#" class="icon_all" id="icon_all">ALL</a>
    <a href="#" class="henry" id="henry">HENRY</a>
    <a href="#" class="john" id="john">JOHN</a>

<div class="company_box_white box_a">
    <div class="company_box">
      <div class="button-list"><span class="white_letter">A</span><span class="arrow_menu"></span></div>
      <div class="company_box_list">
        <ul class="name_icon">
          <li><a href="#"><p data-key-value="robert">robert</p></a></li>
          <li><a href="#"><p data-key-value="henry">henry</p></a></li>
          <li><a href="#"><p data-key-value="steve">steve</p></a></li>
          <li><a href="#"><p data-key-value="dean">dean</p></a></li>
        </ul>
      </div>
    </div>
  </div>

該代碼似乎太大，無法按原樣發布，這是一個小提琴鏈接。 https://jsfiddle.net/6sku2ro5/1/

提前致謝。

Answer 1

我已經根據在初始框中單擊名稱的方式在下面的框中使用隱藏和顯示文本的方式。

您的代碼中幾件事已糾正，現在匹配的相關名稱選擇將顯示在下面的每個框中。

 if (p_data_value == currentPerson || currentPerson == "icon_all") {
      //$(allBoxArr[index]).find('li').find('p').append(p_content);
      $(this).show();
    } else {
      $(this).hide();
    }

工作提琴