Question

我目前正在尝试将自定义JS功能（通过Live Code Editor插件）添加到我的wordpress网站。目标是在点击后改变切换的背景颜色（即从红色 - >绿色）。我已经尝试过这个函数但是虽然选择器适用于CSS，但JS函数不起作用：

CSS：

\23 toggle-id-1 { background-color: red; }

JS：

var \23 toggle-id-1 = document.getElementById("\23 toggle-id-1");

\23 toggle-id-1.onclick = function(){ \23 toggle-id-1.style.backgroundColor = "green"; }

在JSFiddle中，这没有任何问题，这个插件有什么不同吗？

谢谢！

Answer 1

jQuery解决方案：

＆＃13;

    $("#toggle-id-1").click(function () {
       $(this).toggleClass("green");
    });

＆＃13;

    #toggle-id-1 {
        background-color: red;
        height: 100px;
        width: 100px;
    }
            
     #toggle-id-1.green { background-color: green; }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="toggle-id-1" class=""></div>

＆＃13;

Answer 2

变量名中不能包含空格。将变量命名为其他内容。

通过wordpress中的自定义JS单击后更改切换的背景颜色

2 个答案: