我有一个按钮<button id="subs1">test</button>和一个divjQuery的 - .removeClass不起作用
<div class="subsystem subhide">
<h3 style="text-align: center; font-size: 30px; font-weight: normal;">Electronics</h3>
<p>Lorem</p>
</div>
在CSS文件中的类.subhide被定义为
.subhide {
display: none;
}
和jQuery的代码，我'试图去工作是
jQuery('#subs1').on('click', function(){
jQuery('.subsystem').removeClass('subhide');
});
当点击按钮什么都没有发生，为什么？
在此先感谢！
问题是，jQuery('#subs1')找到具有该id的元素并绑定到它们。如果元素在绑定时没有id，则不会处理事件。
为了解决此问题，on document ready包裹代码，这样一来当你的DOM（文档）已经准备好你的代码将只执行。
在文档“准备就绪”之前，不能安全地操作页面。 jQuery为您检测到这种状态。包含在
$(document).ready()中的代码只有在页面文档对象模型（DOM）准备好要执行JavaScript代码时才会运行。
在另一方面，如果你的按钮是动态添加，也不会在那里当事件监听器要进行绑定，所以代码实际上将无能为力。为了解决这个问题，你的代码更改为以下：
jQuery(document.body).on('click', '#subs1', function() {
jQuery('.subsystem').removeClass('subhide');
});
此事件将被连接到document.body这是永远存在的DOM树。现在单击主体时，无论按钮连接到DOM的时间如何，事件都会传播到#subs1。
这里是一个工作示例：
$(document).ready(function() {
jQuery(document.body).on('click', '#subs1', function() {
jQuery('.subsystem').removeClass('subhide');
});
jQuery(document.body).on('click', '#subs2', function() {
jQuery('.subsystem').addClass('subhide');
});
});.subhide {
display: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="subs1">Unhide</button>
<button id="subs2">hide</button>
<div class="subsystem subhide">
<h3 style="text-align: center; font-size: 30px; font-weight: normal;">Electronics</h3>
<p>Lorem</p>
</div>jQuery('#subs1').on('click', function(){
jQuery('.subsystem').removeClass('subhide');
});
jQuery('#toggle').on('click', function(){
jQuery('.subsystem').toggle('subhide');
});.subhide {
display: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="subsystem subhide">
<h3 style="text-align: center; font-size: 30px; font-weight: normal;">Electronics</h3>
<p>Lorem</p>
</div>
<button id="subs1">Button</button>
<button id="toggle">Toggle Button</button>您需要CLAS之外定义按钮s
希望这个帮助！
试试：
，如果你使用Chrome，清除浏览器缓存。
在样式表中，将其更改为：
.subsystem.subhide {
display: none;
}
.subsystem {
display: anything;
}
它应该工作
我不同意这个，默认是'display：block' for div由spec定义。你不应该添加冗余代码。也没有必要增加类的特殊性'.subhide'就足够了。 – Bamieh
“display：anything;”不是有效的CSS。对于“显示”属性没有“任何”选项。仅供参考;） –
我真的不知道为什么，但这个片段的工作原理：
jQuery(document).ready(function() {
jQuery('#subs1')
.click(function(){
jQuery('body').find('.subsystem').addClass('subhide')})
});
您可以检查是否有错误还可以创建一个演示？ – guradio
子系统的作用是什么？请添加子系统CSS请 – hamzox
您是否包含jQuery库？ – Dekel