web-dev-qa-db-ja.com

JavaScriptでボタンを非表示にする

私の最新のプログラムには、クリックするといくつかの入力ポップアップボックスを表示するボタンがあります。これらのボックスが消えた後、ボタンを非表示にするにはどうすればよいですか？

javascripthtml5buttonhide
22
dualCore

visibilityプロパティを設定 をhiddenに設定できます。

1つのボタンを使用して他のボタンを切り替える小さなデモを次に示します。

<input type="button" id="toggler" value="Toggler" onClick="action();" />
<input type="button" id="togglee" value="Togglee" />

<script>
    var hidden = false;
    function action() {
        hidden = !hidden;
        if(hidden) {
            document.getElementById('togglee').style.visibility = 'hidden';
        } else {
            document.getElementById('togglee').style.visibility = 'visible';
        }
    }
</script>
44
Philippe
visibility=hidden

は非常に便利ですが、それでもページ上のスペースを占有します。使用することもできます

display=none

オブジェクトを隠すだけでなく、表示されるまでスペースを占有しないようにするためです。 （また、ディスプレイの反対は「見える」のではなく「ブロックする」ことを覚えておいてください）

14
BennyMathison

このようなものはそれを削除する必要があります

document.getElementById('x').style.visibility='hidden';

このdom操作の多くを行うつもりなら、jqueryを見る価値があるかもしれません

6
Dominic Green
document.getElementById('btnID').style.visibility='hidden';
3
Mo3z
//Your code to make the box goes here... call it box
box.id="foo";
//Your code to remove the box goes here
document.getElementById("foo").style.display="none";

もちろん、このような多くのことをしている場合は、 jQuery を使用します

2
diracdeltafunk

JQueryを使用していない場合は、使用することをお勧めします。もしそうなら、あなたは次のようなことをしたいと思うでしょう：

$( 'button' ).on(
   'click'
   function (  )
   {
       $( this ).hide(  );
   }
);
0
Wes Crow

ボタンを押すと、メッセージを警告する機能を呼び出す必要があります。したがって、アラートの後に_style visible_ propertyを入れてください。あなたはそれを達成することができます

_function OpenAlert(){
        alert("Getting the message");
        document.getElementById("getMessage").style.visibility="hidden";
        
    }_
 <input type="button" id="getMessage" name="GetMessage" value="GetMessage" onclick="OpenAlert()"/>

これが役立つことを願っています。お力になれて、嬉しいです

0
Anand Dwivedi
<script>
$('#btn_hide').click( function () {
$('#btn_hide).hide();
});
</script>
<input type="button" id="btn_hide"/>

これで十分でしょう

0
Sanjun Dev