2017-04-25 55 views
0

我想根据类别名称,隐藏和显示DIV ID =“brandmenu”在阵列上存在.. 如果数组包含类别名称,则表明这个div否则隐藏这个div 。匹配类别名称与jQuery阵列和隐藏特定的div

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script> 
    var brandmenu = $("#brandmenu"); 
    var catName = "Activewear"; 
    var myarr = ["Activewear", "Anvil", "Bulwark", "CornerStone", "District", "District Made", "Fruit of the Loom", "Gildan", "Hanes", "Jerzees", "Port & Company", "Port Authority", "Precious Cargo", "Red House", "Red Kap", "Russell Outdoors", "Sport-Tek"]; 
    var arraycontainsturtles = (myarr.indexOf(catName) > -1); 
    if(arraycontainsturtles == true) { 
     brandmenu.show(); 
    } else { 
     brandmenu.hide(); 
    } 
    </script> 
    <div id="brandmenu" style="display:none;"> 
     content to hide and show 
    </div> 
+0

什么是你的问题? –

+0

我想在特定类别的网页上显示div id =“brandmenu”。就像{{category.name}}是CornerStone。当我转到CornerStone类别时,div应该是可见的。 –

回答

0

首先,你需要遍历a标签每li然后查找HTML。在你的数组中找到这个词。然后显示/隐藏它。

var brandmenu = $("#brandmenu"); 
    var myarr = ["Anvil", "Bulwark", "CornerStone", "District", "District Made", "Fruit of the Loom", "Gildan", "Hanes", "Jerzees", "Port & Company", "Port Authority", "Precious Cargo", "Red House", "Red Kap", "Russell Outdoors", "Sport-Tek"]; 

    $('.navList > li').each(function(index,val){ 
     var catName = $(this).find('a').html(); 
     var arraycontainsturtles = (myarr.indexOf(catName) > -1); 
     if(arraycontainsturtles == true) { 
      $(this).show(); 
      } else { 
      $(this).hide(); 
     } 
    }); 

Fiddle

+0

var catName =“{{. category.name}}”; //category.name是动态值.. bigcommerce stencil变量..我想我是在正确的轨道上。 :) –