问题描述
|
单击标题以展开菜单时,可以更改CSS。但是,其他已扩展的\'header \'无法更改为\“ inactive \”类。
以下是我的HTML
<dt class=\"productsCat\"><a href=\"/\" class=\"productsName\">Category 1</a></dt>
<dd class=\"subCat\"><a href=\"<?PHP echo $subCategory->getUrl()?>\">Sub Category 1</a></dd>
<dt class=\"productsCat\"><a href=\"/\" class=\"productsName\">Category 2</a></dt>
<dd class=\"subCat\"><a href=\"<?PHP echo $subCategory->getUrl()?>\">Sub Category 2</a></dd>
这是我的jQuery
jQuery(document).ready(function(){
jQuery(\"dl#narrow-by-list> dd:not(:first)\").hide();
jQuery(\"dl#narrow-by-list> dt a\").click(function(){
jQuery(\"dl#narrow-by-list> dd:visible\").slideUp(\"fast\");
jQuery(this).parent().next().slideDown(\"fast\");
jQuery(this).parent().removeClass(\"productsCat\");
jQuery(this).parent().addClass(\"openSub\");
return false;
});
});
任何建议如何在一个活动的情况下从所有其他同级中删除类“ openSub”并使用现有的类“ productsCat”?
谢谢!
解决方法
所以,尝试一下,在我本地工作。
$(function() {
$(\"dl#narrow-by-list> dd:not(:first)\").hide();
$(\"dl#narrow-by-list > dt\").first().addClass(\'openSub\');
$(\".productsName\").click(function () {
if(!$(this).closest(\'dt\').hasClass(\'openSub\')) {
$(\"dl#narrow-by-list> dd:visible\").slideUp(\"fast\");
}
$(this).parent().next().slideDown(\"fast\");
$(this).parent().each(function () {
$(this).parents(\'dl\').find(\'dt\').each(function() {
$(this).addClass(\'productsCat\');
$(this).removeClass(\'openSub\');
});
$(this).closest(\'dt\').toggleClass(\'productsCat openSub\');
});
return false;
});
});
, 不知道您想要什么,但也许像这样?否则您可以尝试使用toggleclass?
jQuery(document).ready(function () {
jQuery(\"dl#narrow-by-list> dd:not(:first)\").hide();
jQuery(\"dl#narrow-by-list> dt a\").click(function () {
jQuery(\"dl#narrow-by-list> dd:visible\").slideUp(\"fast\");
jQuery(this).parent().next().slideDown(\"fast\");
jQuery(this).parent().each(function () {
if (jQuery(this).hasClass(\'productsCat\')) {
jQuery(this).removeClass(\'productsCat\');
jQuery(this).addClass(\"openSub\");
}
});
return false;
});
});