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

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

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

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

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

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

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

以下がソースです。

実際に動作するボタン

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


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

関連記事

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

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

記事を読む

JavascriptでJavaの配列を扱う方法

JavascriptでJavaのint[]の配列を扱う JavascriptからJavaで作成した

記事を読む

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

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

記事を読む

Javascriptで日付から曜日を求める

Javascriptで日付から曜日を求める Javascriptで指定された日付の曜日を取得します

記事を読む

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

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

記事を読む

SQLServer

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

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

記事を読む

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

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

記事を読む

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

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

記事を読む

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

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

記事を読む

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

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

記事を読む

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

TABLEタグに行を追加、削除する Javascriptを使って

Javscriptでイベントを追加する

Javscriptで既存のイベントに処理(関数)を追加する すでにあ

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

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

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

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

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

ブラウザーに印刷プレビューボタンを作成する Internet Exp

→もっと見る



PAGE TOP ↑