点击后隐藏按钮答案

【问题标题】：Hide button after clicked点击后隐藏按钮
【发布时间】：2015-04-30 08:46:52
【问题描述】：

我试图在单击按钮后隐藏按钮（不在表单标签内）。一旦显示表单，按钮就没有用了。所以我想在点击后隐藏它

这是现有的代码。

<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>

&lt;input id="info" type="button" value="Имате Въпрос?" class="switchbuton"&gt;

【问题讨论】：

顺便说一下，我猜你是用第三方库来做开关按钮的，所以类属性可能是"switchbutton"。
另外，请描述究竟是什么不起作用（您是否收到任何错误，或者您的块没有隐藏）
这符合您的要求吗...jsfiddle.net/5epLf928/1 ?
我认为问题在于你如何包装函数......看看 uzay 的回答

标签： javascript html

【解决方案1】：

你可以使用jQueryhide

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

和show 喜欢

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

或toggle 切换 dom 元素的可见性

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

【讨论】：

【解决方案2】：

你可以在这里查看结果：

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

代码是：

<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);
})()

【讨论】：

谢谢它的工作。如何向按钮添加图像？
@Mo-Alaneth，请再检查一遍。
太棒了！你让我今天一整天都感觉很好。谢谢

【解决方案3】：

你为什么不使用：

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

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

【讨论】：