ホームページ > ウェブフロントエンド > フロントエンドQ&A > JavaScriptでチェックボックスを非表示にする方法

JavaScriptでチェックボックスを非表示にする方法

青灯夜游
リリース: 2022-01-26 11:46:12
オリジナル
1946 人が閲覧しました

方法: 1. div 要素を使用してチェック ボックスをラップします。 2. "document.getElementById("id value")" を使用して div 要素のノードを取得します。 3. "div 要素のノード.style" を使用します。 .display = "none";" ステートメントにより、チェックボックスが非表示になります。

JavaScriptでチェックボックスを非表示にする方法

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

JavaScript でチェック ボックスを非表示にします

チェック ボックスを非表示にします。つまり、チェック ボックスを非表示にします。

隠し要素に関しては、display:none を使用することを考えますが、これにはこのスタイルを要素に追加する必要があります。

#実装コード:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

    </head>

    <body>

        <div id="box">

             爱好:<input type="checkbox" name="running" id="run">跑步

             <input type="checkbox" name="running" id="read">阅读

             <input type="checkbox" name="running" id="shop">购物

        </div>

        <br />

        <button onclick="myFunction()">让复选框不可见</button>

        <script>

            function myFunction() {

                var box = document.getElementById("box");

 

                box.style.display = "none";

            }

        </script>

    </body>

 

</html>

ログイン後にコピー

JavaScriptでチェックボックスを非表示にする方法

[関連する推奨事項:

JavaScript 学習チュートリアル]

以上がJavaScriptでチェックボックスを非表示にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート