[ jQuery] 你還在使用jquery的click(),bind()方法麼?

時間 2019-11-13

標籤 jquery 還在使用 click bind 方法欄目 JQuery 简体版

原文原文鏈接

下面只是一個demo，固然這裏包含了jquery的插件的寫法。javascript

關於jquery的插件的寫法，能夠自行百度。若是你的自學能力夠厲害的話，能夠查看jquery的源碼。html

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

如裏你從這裏學到了什麼，那麼恭喜！java