HTMLで動的にコントロールの表示/非表示を切り替える

公開日: : 最終更新日:2013/12/12 テクニック , , , , , ,

動的にコントロールの表示/非表示を切り替える

HTMLとJavascriptを使って表示されているテキストボックス(INPUTタグ)の
表示/非表示を切り替えます。

テキストボックス(INPUTタグ)の表示/非表示を切り替えるには

テキストボックス(INPUTタグ)の表示/非表示を切り替えるには
表示する際にはstyle.visibilityvisibleを、
非表示にする場合にはstyle.visibilityhidden
設定します。

テキストボックス(INPUTタグ)の表示/非表示を切り替えるソース

以下がソースです。

実際に動作するボタン

ボタンを押下するとテキストボックス(INPUTタグ)の表示/非表示が入れ替わります。
以下が実際のボタンです。


スポンサーリンク
スポンサーリンク
  • このエントリーをはてなブックマークに追加
  • 13 follow us in feedly

関連記事

「===」で値だけではなく型の一致もチェック

Javascriptで値だけではなく方の一致もIF文でチェックする ふと、とあるソースを眺めている

記事を読む

SQLServer

setInterval()やsetTimeout()に引数ありの関数を指定する

setInterval()やsetTimeout()に引数ありの関数を使う Javascriptで

記事を読む

HTML-AタグのhrefをJavascriptで動的に有効/無効を切り替える。

Aタグのhrefの有効無効を切り替える 画面の選択状態によってAタグのhrefを動的に有効/無効を

記事を読む

モーダルダイアログを画面中央に表示する

モーダルダイアログを画面中央に表示 JavaScriptでモーダルダイアログを表示するには 「s

記事を読む

POSTをしても新しい画面が開かない方法

formをPOSTすると新しい画面が開いてしまう showModalDialogで開いた画面でfo

記事を読む

JavascriptでTABLEタグに行を追加、削除する

TABLEタグに行を追加、削除する Javascriptを使ってHTML上のテーブルに行を追加

記事を読む

ブラウザーに印刷プレビューボタン作成

ブラウザーに印刷プレビューボタンを作成する Internet Explorer(IE)で印刷プレビ

記事を読む

Javascriptでメッセージボックスを表示する

メッセージボックスを表示 画面にJavascriptでメッセージボックスを表示します。 久々にJ

記事を読む

Javascriptの変数は初期化して使わないとundefinedになるので要注意

どんな言語もローカル変数は初期化して使うのが良い Javascriptに限らずどんな言語にも言える

記事を読む

Javascriptで開いた子画面から親画面の関数を呼び出す

子画面から親画面の関数を呼び出す Javascriptで開いた子画面(ポップアップウィンドウ)から

記事を読む

Javascriptで開いた子画面から親画面の関数を呼び出す

子画面から親画面の関数を呼び出す Javascriptで開いた子画面

Javascriptでメッセージボックスを表示する

メッセージボックスを表示 画面にJavascriptでメッセージボッ

Javascriptの変数は初期化して使わないとundefinedになるので要注意

どんな言語もローカル変数は初期化して使うのが良い Javascrip

ブラウザの閉じるボタンが押下された時の制御

ブラウザの閉じるボタン(「×」)が押下された時のイベント ブラウザの

POSTをしても新しい画面が開かない方法

formをPOSTすると新しい画面が開いてしまう showModal

→もっと見る



PAGE TOP ↑