Мне нужна моя созданная кнопка, чтобы открыть закрытие содержимого div в wordpress

Question

У меня есть div с содержимым, т.е. короткий код, изображения, ссылки и т. д.

Мне нужен мой переключатель для переключения контейнера div без jquery. Я проводил дни и очень ценю некоторую помощь.

Я включил код переключения. На от DIV должен быть display.style = "никто"

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>

Выньте onclick=changeImage() функции из <img> элемента, и добавьте следующий JQuery (находится в первой части snippett) в ваши <script> тегов на HTML.

$(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">