JQuery 合成事件(hover,toggle,one),事件多播(绑定多个函数)

最新推荐文章于 2021-06-02 18:27:19 发布

houyanhua1

最新推荐文章于 2021-06-02 18:27:19 发布

阅读量324

点赞数

分类专栏： JQuery 文章标签： jquery

本文链接：https://blog.csdn.net/houyanhua1/article/details/78824124

版权

JQuery 专栏收录该内容

57 篇文章 0 订阅

订阅专栏

合成事件：
hover(fn1,fn2):fn1表示mouseover的处理函数，fn2表示mouseout的处理函数
toggle(fn1,fn2...fnN):当元素被click后，轮流执行fn1、fn2、fnN方法
one(type,fn)：表示注册的事件只响应一次，然后失效，type表示事件类型

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="scripts/jquery-1.7.1.min.js"></script>
    <script>
        $(function () {
            //合成鼠标指向、移开事件
            $('#btnShow').hover(function() {//指向
                this.style.color = 'red';
            }, function() {//移开
                this.style.color = 'black';
            });
            
            //合成点击事件,指定在n个函数间轮流切换，点击次数为m。事件多播（一个事件绑定多个函数）
            $('#btnShow').toggle(function() {//第m%n==1次点击时执行此函数
                alert(1);
            }, function() {//第m%n==2次点击执行此函数
                alert(2);
            }, function() {//第m%n==0次点击执行此函数
                alert(3);
            });
            
            //合成事件：只将绑定的事件执行一次
            $('#btnShow').one('click', function() {
                alert(1);
            });
        });
    </script>
</head>
<body>
    <input type="button" id="btnShow" value="显示"/>
</body>
</html>

houyanhua1

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery 合成事件(hover,toggle,one),事件多播(绑定多个函数)

合成事件：hover(fn1,fn2):fn1表示mouseover的处理函数，fn2表示mouseout的处理函数toggle(fn1,fn2...fnN):当元素被click后，轮流执行fn1、fn2、fnN方法one(type,fn)：表示注册的事件只响应一次，然后失效，type表示事件类型 $(function (
复制链接

扫一扫

专栏目录