Question

我有一个包含一堆切换的菜单。每个项目都会切换不同的内容。

我正在尝试制作一个整体“重置”按钮，将某些内容重置为某些默认设置。我需要检测菜单项是否切换，如果是，则在该特定项上执行一些代码，如果没有，则不执行任何操作。打开一个项目，它会获得一个CSS背景颜色，如下所示，所以我想出了以下重置代码：

$('#app-menu ul.dynamic-items li ul li').toggle(function () {
    $(this).css({background: "#4c581e"});
}, function () {
    $(this).css({background: "none"});
});

/* Reset Button */

$(".reset").click(function() {
    if( $('#app-menu ul.dynamic-items li').css({background: "#4c581e"}) != null )  { 
        $(this).click(); /* If the item has the background code mentioned above, it is toggled on, therefore this "click" should reset its state */
    } 
    else { 
    // do nothing //
    };
});

基本上我想说的是，如果一个菜单项具有＃4c581e背景，这意味着它已切换，因此应该“点击”以再次将其关闭。

问题是，它不起作用。我对jQuery很新，所以我觉得我做错了。

任何想法的人？

编辑：我只想注意菜单项实际上是在页面上切换DIV元素，所以它不仅仅是重置菜单项的css样式。这就是为什么我试图让它“点击”该项目，如果检测到特定的CSS属性，因为“点击”它将基本上再次关闭它。

Answer 1

1

$(this).css("background-color")将返回该值，但它可能是一个rgb值。

=＆GT; rgb（255,255,255）

因此要么比较rgb值，要么使用一些转换工具。

http://www.jquery4u.com/jquery-functions/jquery-convert-rgb-hex-color/

2

您可能只想使用css类，并切换类。然后，“重置”按钮可以将所有默认类重新应用于元素，这对IMO来说更加清晰。

$('#app-menu ul.dynamic-items li ul li').toggle(function () {
    $(this).toggleClass("active");
});
$(".reset").click(function() {
    $('#app-menu ul.dynamic-items li ul li').removeClass("active");
});

css可能是：

li.active {
  background-color: #4c581e;
  display: block;
}

jQuery - 如果元素具有特定的CSS属性，则执行脚本

1 个答案: