HTML5-and-CSS/events_2.html at master · ashutoshdhondkar/HTML5-and-CSS · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Events</title>
        <script src="JQuery/jquery-3.3.1.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                // using bind event
                // binding events and actions together
                // bind('select_event',function)
//                $('.input').bind('select',function(){
//                    $('.input').css('background','yellow');
//                    alert("Seected");
//                })
                // bind is same as on
                // only difference is on is onetime usable
                // using unbind
                $('p').click(function(){
                    $(this).fadeToggle(1000);
                });

                // removing bind effect
                // similar to off event
                $('button').click(function(){
                    $('p').unbind();
                });
            });
        </script>
    </head>
    <body>
        <!-- <input type="text" class="input"> -->
        <p>Hello world</p>
        <p>I am web developer</p>
        <button>Remove event</button>
    </body>
</html>