CODEWITHSUNDEEP
javascripthtml
Mo-Alanteh
Mo-Alanteh

Reputation: 361

Hide button after clicked

I am trying to hide a button (not inside form tags) after it has been clicked. Once the form is shown, there is no use for the button. So i would like to hide it after clicked

Here's the existing code.

<script type="text/javascript">
	$(function(){
		var button = document.getElementById("info");
		 var myDiv = document.getElementById("myDiv");

		 function show() {
		     myDiv.style.visibility = "visible";
		 }

		 function hide() {
		     myDiv.style.visibility = "hidden";
		 }

		 function toggle() {
		     if (myDiv.style.visibility === "hidden") {
		         show();
		     } else {
		         hide();
		     }
		 }

		 hide();

		 button.addEventListener("click", toggle, false);
	});
</script>
<input id="info" type="button" value="Имате Въпрос?" class="switchbuton">

Upvotes: 3

Views: 13972

Answers (3)

uzay95
uzay95

Reputation: 16642

You can check the result here:

http://jsfiddle.net/jsfiddleCem/33axo20f/2/

Code is:

<style>
.showButon{
    background:url('http://spacetelescope.github.io/understanding-json-schema/_static/pass.png');
    background-repeat:repeat-y;
    height:30px;
    text-indent:20px;
}
</style>

<div id="myDiv">
    <input id="info" type="button" value="Имате Въпрос?" class="showButon" />
</div>

(function(){
var button = document.getElementById("info");
    var myDiv = document.getElementById("myDiv");

    function toggle() {
        if (myDiv.style.visibility === "hidden") {
            myDiv.style.visibility = "visible";
        } else {
            myDiv.style.visibility = "hidden";
        }
    }

    button.addEventListener("click", toggle, false);
})()

Upvotes: 1

Robin
Robin

Reputation: 864

You can use jQuery hide

$("#myDiv").hide() // to hide the div

and show like

$("#myDiv").show() // to show the div

Or toggle to toggle the visibility of dom elements

$("#myDiv").toggle() // to toggle the visibility

Upvotes: 2

Kartic
Kartic

Reputation: 2983

Why don't you use:

<script type="text/javascript">
    $(function(){
        $('#info').click(function() {
            $(this).hide();
        });
    });
</script>

<input id="info" type="button" value="Имате Въпрос?" class="switchbuton">

Upvotes: 0

Related Questions