事件绑定的多种方式

正在看第二遍锋利的jQuery，第一遍因为只是在草稿纸上手写代码所以看完之后印象不是很深，这次决定把书上的案例都在本地自己敲一遍，希望可以加深理解。哈哈，这里就记录一下学习的历程吧！

jquery中的事件绑定类型比普通的javascript事件绑定类型少了“on”。

一.bind(eventType,fn)；

 var item=$("#head");
    //绑定点击事件
    /*item.bind("click",function(){
        if(item.next().is(":visible")){
            item.next().hide();
        }else{
            item.next().show();

        }
    })*/
    //绑定鼠标滑动事件
    var content=item.next();
   content.hide();
     /*item.bind("mouseover",function(){
        content.show();
    }).bind("mouseout",function(){
        content.hide();
    });*/

像click,mouseover,mouseout这类事件在程序中经常用到jquery为此提供了一套简写的方法。

//jquery 提供了简写的方法，与bind()的使用和实现的效果一致。唯一区别是可以减少代码量！
    item.mouseover(function(){
        content.show();
    }).mouseout(function(){
        content.hide();
    })

二.hover(enter,leave);

该方法用来模拟光标悬停事件。当光标移动到元素上是触发第一个事件函数(enter)，当光标一处这个元素时触发第二个事件函数(leave)。

 //用jquery的 hover()方法改写上面的例子

    item.hover(function(){
        content.show();
    },function(){
        content.hide();
    });

三 toggle()方法

1.模拟鼠标连续单击事件。（这个效果已经被取消了）✘✘
2.切换元素的可见状态(可见变不可见，不可见变可见)✔✔

//toggle()方法 模拟鼠标连续单击事件  这个方法被取消了现在是用于切换元素的可见状态
    item.mouseover(function(){
        content.toggle();
    }).mouseout(function(){
        content.toggle();
    });