javaweb/JQuery/src/Event/on_bind.html at master · CPU-Code/javaweb · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>on绑定事件</title>
    <script src="../js/jquery-3.3.1.min.js" type="text/javascript" charset="UTF-8"></script>

    <!--
    2. on绑定事件/off解除绑定
        * jq对象.on("事件名称",回调函数)
        * jq对象.off("事件名称")
            * 如果off方法不传递任何参数，则将组件上的所有事件全部解绑
    -->
    <script>
        $(function () {
            //1.使用on给按钮绑定单击事件  click
            $("#btn").on("click", function () {
                alert("我被点击了。。。");
            });

            //2. 使用off解除btn按钮的单击事件
            $("#btn2").click(function () {
                //解除btn按钮的单击事件
                //$("#btn").off("click");

                //将组件上的所有事件全部解绑
                $("#btn").off();
            });
        });
    </script>
</head>
<body>
    <input id="btn" type="button" value="使用on绑定点击事件">
    <input id="btn2" type="button" value="使用off解绑点击事件">
</body>
</html>