jquery中的on方法使用介绍

复制代码 代码如下:

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