How to use js to hide and show the button on click?-JS Tutorial-php.cn

How to use js to hide and show the button on click?

藏色散人

Release： 2021-02-10 09:25:22

Original

23437 people have browsed it

This article mainly introduces how to use js to realize the hiding and display effects of clicking buttons, which is more convenient for user experience.

Note: jQuery is a fast and concise JavaScript framework. It is another excellent JavaScript code library (or JavaScript framework) after Prototype. The purpose of jQuery's design is "write less, do more", which means writing less code and doing more things. It encapsulates common JavaScript function codes, provides a simple JavaScript design pattern, and optimizes HTML document operations, event processing, animation design and Ajax interaction.

js implements the effect of hiding and displaying when clicking a button. The specific code examples are as follows:

<!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>

Copy after login

You can directly copy the above code for local demonstration. I hope this article introduction will be helpful to everyone.

How to use js to hide and show the button on click?

[Related article recommendations]

How to add a click event in js

js simulates a click event

jQuery triggers a click event by default when running the page for the first time

JQuery simulates a click event and automatically triggers the event

Detailed explanation of the conflict between hover and click events in jQuery (picture)

The above is the detailed content of How to use js to hide and show the button on click?. For more information, please follow other related articles on the PHP Chinese website!