用打開它的相同按鈕隱藏文本

Question

如何通過單擊同一按鈕來隱藏在單擊按鈕時打開的文本？ 換句話說，單擊同一按鈕應顯示或隱藏文本。

這是顯示文本的代碼：

<h3> 
    <button class="button" onclick="myFunction()" ><img src="infoicon.png" height="30"></button>
                    <p id="infos"></p>

                    <script>
                        function myFunction() {
                            document.getElementById("infos").innerHTML = "blablabla";
                    }
                    </script>
</h3>

Answer 1

定義變量以保存按鈕狀態

 var clicked = 0; function myFunction() { if(clicked == 0 ) { document.getElementById("infos").innerHTML = "blablabla"; clicked = 1; } else { document.getElementById("infos").innerHTML = ""; clicked = 0; } } 

 <h3> <button class="button" onclick="myFunction()" ><img src="infoicon.png" height="30"></button> <p id="infos"></p> </h3> 

Answer 2

試試看，它對我有用：

 function showHide() { var demo = document.getElementById('demo'); if (demo.innerHTML === "") { demo.innerHTML = "bla"; } else { demo.innerHTML = ""; } } 

 <p id="demo"></p> <button onclick="showHide()">Show Hide</button> 

Answer 3

使用jQuery非常簡單

$( "#button" ).click(function() {     
    $('#text-to-toggle').toggle(200);
});