我正在尝试创建一个复选框,在单击时隐藏特定的css类,但我也希望此效果应用于获取该特定类的所有未来对象.
例如:我有2个div:
divA属于abc类
divB没有课
我希望复选框隐藏所有类的div abc
,这很容易,使用$(".abc").hide()
.但问题是,如果网站的另一部分abc
稍后创建了类的divB ,那么它将不会被隐藏.因为jquery代码当时只适用于divA.
我要做的是让复选框操纵文档的全局css定义.因此,当用户单击该复选框时,我将更改abc
要隐藏的类,稍后当任何div加入该类时,它将被隐藏.
这有可能在jquery?
Sam*_*son 32
您可以使用insertRule
和addRule
(必要时)方法向.abc
选择器添加新规则.这应该影响将来应用于该类的任何事情.
var stylesheet = document.styleSheets[0],
selector = ".abc", rule = "{color: red}";
if (stylesheet.insertRule) {
stylesheet.insertRule(selector + rule, stylesheet.cssRules.length);
} else if (stylesheet.addRule) {
stylesheet.addRule(selector, rule, -1);
}
Run Code Online (Sandbox Code Playgroud)
有一个jQuery插件,这也:$.rule()
; 它可以在https://github.com/flesler/jquery.rule上找到
Ral*_*ner 18
我可能会通过让你的复选框添加并从<body>元素中删除一个类来处理这个问题:
$('body').toggleClass('hideABC');
Run Code Online (Sandbox Code Playgroud)
并拥有以下CSS:
body.hideABC div.abc { display:none; }
body div.abc { display:block; }
Run Code Online (Sandbox Code Playgroud)
因此,如果您的页面中的其他地方<div>添加了".abc"类,那么它将采用第一个CSS规则并被隐藏.
归档时间: |
|
查看次数: |
17772 次 |
最近记录: |