JQuery-- 事件绑定

• jquery标准的绑定方式

jq对象.事件方法(回调函数)；

表单对象.submit(function(){})
回调函数没有返回值或者返回true，则表单提交
返回flase则表单不提交

如果调用事件方法，不传递回调函数，则会触发浏览器默认行为。
表单对象.submit();//让表单提交

例子

$("#name").mouseover(function () {
                alert("鼠标来了...")
            }).mouseout(function () {
                alert("鼠标走了...")
            })

• on绑定事件/off解除绑定

jq对象.on(“事件名称”,回调函数)
jq对象.off(“事件名称”)

如果off方法不传递任何参数，则将组件上的所有事件全部解绑

例子

$("#btn").on("click",function () {
      alert("我被点击了。。。")
}) ;

• 事件切换：toggle

jq对象.toggle(fn1,fn2…)

当单击jq对象对应的组件后，会执行fn1.第二次点击会执行fn2.....

注意：1.9版本 .toggle() 方法删除,jQuery Migrate（迁移）插件可以恢复此功能。

<script src="../js/jquery-migrate-1.0.0.js" type="text/javascript" charset="utf-8"></script>

例子

$("#btn").toggle(function () {
               //改变div背景色backgroundColor 颜色为 green
               $("#myDiv").css("backgroundColor","green");
           },function () {
               //改变div背景色backgroundColor 颜色为 pink
               $("#myDiv").css("backgroundColor","pink");
           });
        });

插件：增强JQuery的功能
实现方式：

• $.fn.extend(object)
  自定义一个JQuery对象都可以用的方法

添加2个方法 check() 选中所有复选框，uncheck() 取消选中所有复选框

//1.定义jqeury的对象插件
$.fn.extend({
   //定义了一个check()方法。所有的jq对象都可以调用该方法
     check:function () {
   //this:调用该方法的jq对象
     this.prop("checked",true);
 },
   uncheck:function () {
     this.prop("checked",false);
 } 
 });

• $.extend(object)
  自定义一个全局方法：可以直接$.方法也可以$(#id).方法

 $.extend({
            max:function (a,b) {
                //返回两数中的较大值
                return a >= b ? a:b;
            },
            min:function (a,b) {
                //返回两数中的较小值
                return a <= b ? a:b;
            }
            
            
        });

        //调用全局方法
        var max = $.max(4,3);
        //alert(max);

        var min = $.min(1,2);
        alert(min);