从Javascript/JQuery更改类
我想在选中某个页面时更改该页面中的菜单按钮。 没有问题:我写道(仅使用一个示例): 在CSS中:从Javascript/JQuery更改类,jquery,css,Jquery,Css,我想在选中某个页面时更改该页面中的菜单按钮。 没有问题:我写道(仅使用一个示例): 在CSS中: .idleColor{background:#0f0; ... } .redColor {background:#f00;} 在HTML中: <input id='m3' type=button class=idleColor> .... <script> /* at page end */ $(document).foundation(); .... va
.idleColor{background:#0f0; ... }
.redColor {background:#f00;}
在HTML中:
<input id='m3' type=button class=idleColor>
....
<script> /* at page end */
$(document).foundation();
....
var activeButton = $("#m"+menuId); //assuming menuID=3
activeButton.addClass("redColor");
</script>
....
/*在页面末尾*/
$(document.foundation();
....
var activeButton=$(“#m”+menuId)//假设menuID=3
activeButton.addClass(“红色”);
这应该将按钮背景颜色从空闲颜色替换为活动颜色…简单,但不起作用
两件奇怪的事情:在Firebug中,我看到类被添加到了“className”和“classList”中,但是新的颜色没有出现(而且我不认为我应该回流按钮)
另一件奇怪的事情是,如果我使用$(“#myID”).classList.add(“redColor”)
,我会得到一个错误:myID.classList未定义(?)
环境:基金会网站6 JQuery:JQuery-2.2.4试试这个:
activeButton.removeClass('idleColor').addClass('redColor');
试试这个:
activeButton.removeClass('idleColor').addClass('redColor');
您混淆了本地JavaScript方法和jQuery方法 下面的问题 $(“#myID”).classList.add(“redColor”)我收到一个错误,它说: myID.classList未定义(?) …之所以发生,是因为
classList
不是jQuery的属性,而是本机JavaScript中HTML元素对象的属性。这可以通过以下方法之一解决
仅限jQuery
JavaScript/jQuery混合
仅限JavaScript
您混淆了本地JavaScript方法和jQuery方法 下面的问题 $(“#myID”).classList.add(“redColor”)我收到一个错误,它说: myID.classList未定义(?) …之所以发生,是因为
classList
不是jQuery的属性,而是本机JavaScript中HTML元素对象的属性。这可以通过以下方法之一解决
仅限jQuery
JavaScript/jQuery混合
仅限JavaScript
我想陷入羞愧中:-( 主要问题(班级不变)是由于一个愚蠢、愚蠢、愚蠢的错误造成的 在我的页面中,我有两套菜单,用于中小型屏幕 我用相同的ID复制了每个部分中按钮的相关部分 jQuery函数完成了它的工作,在“small”部分选择了正确的按钮(它发现的第一个按钮),实际上是隐藏的 因为我是用大屏幕测试的,所以没有看到任何变化 至于“类列表”问题,我忘记了它是一个数组,所以它需要一个索引。设置
$(“#myID”)[0]
修复了它
多亏了fauxserious澄清了这一点。现在它可以用javascript和jQuery两种方式工作
这一次我也学到了一些东西:当你确信代码是正确的时候,去别处寻找问题。我想陷入羞愧中:-( 主要问题(班级不变)是由于一个愚蠢、愚蠢、愚蠢的错误造成的 在我的页面中,我有两套菜单,用于中小型屏幕 我用相同的ID复制了每个部分中按钮的相关部分 jQuery函数完成了它的工作,在“small”部分选择了正确的按钮(它发现的第一个按钮),实际上是隐藏的 因为我是用大屏幕测试的,所以没有看到任何变化 至于“类列表”问题,我忘记了它是一个数组,所以它需要一个索引。设置
$(“#myID”)[0]
修复了它
多亏了fauxserious澄清了这一点。现在它可以用javascript和jQuery两种方式工作
这一次我也学到了一些东西:当你确定代码是正确的时,去别处寻找问题。如果你的代码是像你的问题中那样的结构,它将永远不会工作…实际上,如果你看到添加的类可能是一个特殊性问题如果你的代码是像你的问题中那样的结构,它将永远不会工作…实际上,如果你看到cl这可能是一个特殊性问题
$("#myID")[0].classList.add("redColor");
document.getElementById('myId').classList.add("redColor");