ホームページ >ウェブフロントエンド >jsチュートリアル >jsを使用してクリック時にボタンを非表示にしたり表示したりするにはどうすればよいですか?

jsを使用してクリック時にボタンを非表示にしたり表示したりするにはどうすればよいですか?

藏色散人
藏色散人オリジナル
2018-08-06 14:55:4623436ブラウズ

この記事では、ユーザーエクスペリエンスをより便利にする、ボタンをクリックしたときの非表示と表示の効果をjsを使用して実現する方法を主に紹介します。

注: jQuery は、Prototype に次ぐ優れた JavaScript コード ライブラリ (または JavaScript フレームワーク) であり、高速で簡潔な JavaScript フレームワークです。 jQuery の設計の目的は、「書く量を減らし、より多くのことを行う」、つまりコードを書く量を減らし、より多くのことを行うことを意味します。一般的な JavaScript 関数コードをカプセル化し、シンプルな JavaScript 設計パターンを提供し、HTML ドキュメント操作、イベント処理、アニメーション設計、および Ajax インタラクションを最適化します。

js は、ボタンをクリックしたときの非表示と表示の効果を実装します。具体的なコード例は次のとおりです。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="/jquery/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#hide").click(function(){
                $("p").hide();
            });
            $("#show").click(function(){
                $("p").show();
            });
        });
    </script>
</head>
<body>
<p id="p1">如果点击“隐藏”按钮,就会消失,点击“显示”就会出现。</p>
<button id="hide" type="button">隐藏</button>
<button id="show" type="button">显示</button>
</body>
</html>

ローカルのデモ用に上記のコードを直接コピーできます。この記事の紹介が皆様のお役に立てば幸いです。

jsを使用してクリック時にボタンを非表示にしたり表示したりするにはどうすればよいですか?

【おすすめ関連記事】

jsでクリックイベントを追加する方法

jsはクリックイベントをシミュレートします

jQueryは、ページを初めて実行するときにデフォルトでクリックイベントをトリガーします

JQueryはクリックイベントをシミュレートし、自動的にイベントをトリガーします

jQueryのホバーイベントとクリックイベント間の競合の詳細な説明(写真)

以上がjsを使用してクリック時にボタンを非表示にしたり表示したりするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。