• 你还在使用jquery的click(),bind()方法么?


    这里只是突然发现jquery 1.7 之后的事件绑定推荐了一些变化。jquery推荐使用on方法来绑定事件。

    相信以前都是用的click,bind,unbind方法吧。

    如果你仔细看看jquery的源码的话,那么你会发现bind的方法也是用的on方法来实现的。

    在一定程度上on方法比bind或者是click之类的方法,更高效。

    下面只是一个demo,当然这里包含了jquery的插件的写法。

    关于jquery的插件的写法,可以自行百度。如果你的自学能力够厉害的话,可以查看jquery的源码。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
      <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
       <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
      <title></title>
    </head>
    <body>
        <input type="button" value="test" id="test"/>
        <script type="text/javascript">
            $(function(){
                $("#test").hello({
                    "size":1
                });
            });
        </script>
        <script type="text/javascript">
        ;(function($){
            $.fn.hello = function(options){
                var defaults = {"size":0},
    
                    opts     = $.extend({},defaults,options),
    
                    show = {
                        play:function(options){
                            var _root =  this; 
                            _root.autoPlay();
                            _root.eventClick();
                        },
                        autoPlay:function(){
                            console.log("auto");
                        },
                        eventClick:function(){
                            //$("#test").on("click",{show:"dd"},function(e){
                            //    console.log("click :" +  e.data.show);
                            //});
    
                            $("#test").on({
                                click:function(){
                                    alert("click");
                                },
                                mouseenter:function(){
                                    alert("enter");
                                },
                                mouseleave:function(){
                                    alert("leave");
                                }
                            });
                        }
                    };
                return this.each(function(){
                    show.play(opts);
                });
            };
        })(jQuery);
        </script>
    </body>
    </html>
    

    如里你从这里学到了什么,那么恭喜!

  • 相关阅读:
    my.cnf 配置文档
    win11 默认 右击 老菜单
    慎重修改 profile 文件
    响应延迟数据集 p90/p99 是什么
    Windows 修改 注册表 鼠标右键 菜单 使用**打开
    windows 系统 开启 mysql binlog 变更数据后 根据日志 寻找变更前的数据
    Mysql 的 read_only 只读属性 权限分配 动态权限
    utf8 和 utf8mb4 的区别
    MySQL 数据库 隔离 的 四个级别 和 事务 的 四个特性
    26. 删除有序数组中的重复项
  • 原文地址:https://www.cnblogs.com/yangzhi/p/3576520.html
Copyright © 2020-2023  润新知