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

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

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

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

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

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

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

以下がソースです。

実際に動作するボタン

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


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

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

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

    記事を読む

    JavascriptでJavaの配列を扱う方法

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

    記事を読む

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

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

    記事を読む

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

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

    記事を読む

    Javscriptでイベントを追加する

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

    記事を読む

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

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

    記事を読む

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

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

    記事を読む

    SQLServer

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

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

    記事を読む

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

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

    記事を読む

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

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

    記事を読む

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

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

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

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

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

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

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

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

    Javscriptでイベントを追加する

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

    →もっと見る



    PAGE TOP ↑