我需要创建的按钮才能在Wordpress中打开以关闭内容div

Question

我有一个div的内容，即。 短代码，图像，链接等。

我需要我的开关来切换没有jquery的div容器。 我花了几天的时间，非常感谢您的帮助。

我已经包含了开关代码。 div上必须为display.style =“ none”

html

<img id="switch" onclick="changeImage()" src="http://designplatform.byethost15.com/on.png" width="60" height="150">

的JavaScript

<script>
function changeImage()
{
    element=document.getElementById('switch');
    if (element.src.match("off"))
    {
        element.src="http://designplatform.byethost15.com/on.png";
    }
    else
    {
        element.src="http://designplatform.byethost15.com/off.png";
    }
}
</script>

Answer 1

您可以使用jquery完成此操作。

将jquery添加到您的html中：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

从<img>元素中取出onclick=changeImage()函数，然后将以下jquery（在snippett的第一部分中找到）添加到html的<script>标记中。

 $(function () { $("#switch").click(function () { if ( $("#switch").val()=="off") { $("#switch").attr("src","http://designplatform.byethost15.com/on.png"); $("#switch").val("on"); } else { $("#switch").attr("src","http://designplatform.byethost15.com/off.png"); $("#switch").val("off"); } }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <img id="switch" src="http://designplatform.byethost15.com/on.png" width="60" height="150">