将类添加到具有数组中的id的元素

我有一个包含来自cookie的值的数组，如果其中一个值匹配h2的id，我想添加类测试。这是我尝试过的最新路线。由于将类添加到具有数组中的id的元素

jQuery.each(arr, function(index, value) { 
    $("h2.#" + value).addClass("testing"); 
});

全码：

<script type="text/javascript"> 
$(document).ready(function(){ 
    var cookieName = $("body").attr("id"); 
    storedCookieName = $.cookie(cookieName); 

    if (storedCookieName != null) { 

     var cookieValues = storedCookieName; 
     var arr = storedCookieName.split(','); 
     alert("the cookie values for this page are :" + arr); 

     jQuery.each(arr, function(index, value) { 
      $("#" + value).addClass("testing"); 
     }); 


    } else { 
     var cookieValues = ''; 
     alert("I don't have a cookie for this page"); 
}; 

    //add id's to each drop down box trigger 
$('h2.contentTrigger').attr('id', function(i, value) { 
    return "dropDownTrigger" + (i+1); 
}); 

//Hide (Collapse) the toggle containers on load 
$(".toggle_content_container").hide(); 

//Switch the "Open" and "Close" state per click then slide up/down (depending on open/close state) 
$("h2.contentTrigger").click(function(){ 
    $(this).toggleClass("active").next().slideToggle("fast"); 
    return false; //Prevent the browser jump to the link anchor 
}); 


$("h2.contentTrigger").click(function(){ 

     //get class of clicked item to check if dropdown is active when clicked 
    var triggerClass = $(this).attr("class"); 
     //get id of clicked dropdown 
    var targetLink = $(this).attr("id"); 

    if ((triggerClass == 'contentTrigger noprint active') || (triggerClass == 'contentTrigger print active')) { 
     cookieValues+=($(this).attr("id")+","); 
     $.cookie(cookieName, cookieValues, { path: '/', expires: 10 }); 
     //alert("adding value" + cookieValues);  
    }else{ 
     cookieValues = cookieValues.replace(targetLink+",", ""); 
     $.cookie(cookieName, cookieValues, { path: '/', expires: 10 });  
     //alert("new value" + cookieValues);  
    }; 
}); 

});//end:$(document).ready 
</script> 

</head> 
<body id="<CFOUTPUT>#SMPPageVariables.PageMetaKeywords#</CFOUTPUT>"> 
<div id="container"> 
<CFINCLUDE TEMPLATE="../libraryelements/AR_TwoDeepLeft_Navigation.element"> 
<div id="content"> 
<CFMODULE TEMPLATE="../../modules/mod_page_item_area_display.cfm" AreaID="108" PageID="#SMPPageVariables.PageID#"> 
<CFMODULE TEMPLATE="../../modules/mod_page_item_area_display.cfm" AreaID="109" PageID="#SMPPageVariables.PageID#"> 
<!--Sample of output  
<div class="tab"> 
    <h2 class="contentTrigger noprint"><a>What Is Important To Know</a></h2> 
    <div class="toggle_content_container noprint"> 
     <div class="block"> 
      <h4>Info</h4> 
      <p>Info:</p> 
      <ul> 
       <li>Words</li> 
       <li>Words</li> 
      </ul> 
      <h4>Heading</h4> 
      <p>Paragraph</p> 
      <p>Paragraph</p> 
     </div> 
    </div> 
</div> 
-->  
</div> 
<div class="hidden"><CFMODULE TEMPLATE="../../modules/mod_page_item_area_display.cfm" AreaID="110" PageID="#SMPPageVariables.PageID#"></div> 
</div> 
</body> 
</html>

来源

2011-10-27 Chuck

这看起来像它应该工作。你有可以发布的HTML吗？另外你的“arr”数组是什么样的？ –

什么发生/没有发生？ –

@ Keith.Abramo添加了完整的代码以帮助提供更好的想法，“arr”是逗号分隔的字符串。 – Chuck

你在里面有一个不正确的.和使用ids时不需要使用h2。您需要：

jQuery.each(arr, function(index, value) { 
    $("#" + value).addClass("testing"); 
});

来源

2011-10-27 13:40:21 Exelian

是的，id必须是唯一的！ –

@Exelian可能最终成为解决方案的一部分，但即使进行了更改，我仍然无法将类添加到基于h2数组和ID的值的h2中，我已将完整页面代码添加到原始问题中。 – Chuck

@Exelian谢谢，一旦我解决了另一个问题，它确实有效 – Chuck

jQuery.each(arr, function(index, value) { 
    $("h2#" + value).addClass("testing"); 
});

它看起来像你有锋利的字符前点不应该有

来源

2011-10-27 13:38:45

从您的选择器中删除.; "h2#" + value代替"h2.#" + value

，使代码看起来像

jQuery.each(arr, function(index, value) { 
    $("h2#" + value).addClass("testing"); 
});

来源

2011-10-27 13:40:33

将类添加到具有数组中的id的元素

回答

相关问题