请问有大佬知道为什么toggleclass只执行两次吗。。
就是一开始注册下面没有下划线 通过toggleclass给注册添加类 然后有了下划线之后 再点击 下划线消失 后续操作就没用了
代码还蛮多问题,hasClass没有返回值正则对象,addClass中设置样式少了空格,改了下题主的逻辑,用下面的代码测试可以了。
而且题主视乎少了个功能,应该点击加样式的时候,同时移除兄弟节点的焦点样式。
有帮助麻烦点个采纳【本回答右上角】,谢谢~~有其他问题可以继续交流~
<style>
.OC{font-weight:800;border-bottom:#0084ff solid;}
</style>
<span id="ZC">注册</span>
<span id="DL">登录</span>
<script>
var ZC = document.getElementById('ZC')
var DL = document.getElementById('DL')
ZC.onclick = function () {
toggleClass(ZC,'OC')
}
function hasClass(obj, cn) {
var reg = new RegExp('\\b' + cn + '\\b');
return reg.test(obj.className);
}
function addClass(obj, cn) {
obj.className += ' ' + cn;//这里也少了个空格,toggleClass判断了这里就不需要再判断了
}
function removeClass(obj, cn) {
var reg = new RegExp('\\b' + cn + '\\b');
obj.className = obj.className.replace(reg, '');
}
function toggleClass(obj, cn) {
if (hasClass(obj, cn)) {
removeClass(obj, cn);
}
else addClass(obj, cn);
}
</script>
你点击两次之后,你看一下你的 className 是不是 "OCOC" , 然后点一次加一个 OC