我正在尝试将样式动态应用于页面中的几个下拉列表。使用 jQuery addClass 确实将类添加到所有“选择”元素,正如我可以从我的 Chrome 控制台看到的那样。但是,样式不适用于元素。
现在,如果我手动将类单独添加到每个选择元素,然后保存页面并刷新它,则样式将应用于元素。
知道为什么样式不适用于 jquery 类注入吗?
$("select").addClass("select js-select");
我正在尝试将样式动态应用于页面中的几个下拉列表。使用 jQuery addClass 确实将类添加到所有“选择”元素,正如我可以从我的 Chrome 控制台看到的那样。但是,样式不适用于元素。
现在,如果我手动将类单独添加到每个选择元素,然后保存页面并刷新它,则样式将应用于元素。
知道为什么样式不适用于 jquery 类注入吗?
$("select").addClass("select js-select");
这个例子有效:
<p><a href="#" id="clicker">Add Class</a></p>
<div id="select">Hello World</div>
javascript
$("#clicker").click(function () {
$("#select").addClass("select js-select");
});
通过查看您的代码,似乎 $("select") 上应该有一个 ID 或类选择器。通过拥有其中一个选择器,您的代码将知道应用样式的目标。否则,您的代码可以正常工作。
祝你好运,希望这能帮到你。
您说没有应用样式,但是“select js-select”类是否添加到选择输入中?那么css或者浏览器一定有问题。
$("select").addClass(..) 应该可以工作,不需要您按 ID 或类指定。
如果将 onDomReady 更改为 onLoad,则可以正常工作。如http://jsfiddle.net/gc3wQ/9/
添加到 LazyTarget 的答案。
您尝试使用类添加的样式被可能已经存在于元素中的 CSS 覆盖。
例如,这不起作用(不会隐藏 div)
$(function (argument) {
function loaded(){
$('.landing .scroll').addClass('hidden');
}
loaded();
})
.hidden{
display: none;
transition: all ease-in-out 0.3s;
}
.shown{
display: block;
transition: all ease-in-out 0.3s;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="shown">
<h1>Hello</h1>
</div>