总结bind的几种用法

绑定多个事件类型

比如可以为元素一次性绑定多个事件

$(function(){
            $('#btn').bind('mouseover mouseout',function(){
                $(this).toggleClass('highlight')
            })
        })

代码演示

当光标划入按钮时，class切换为highlight，移出时，class切换为原来的值。等同于下面代码

        $(function(){
            $('#btn').mouseover(function(){
                $(this).toggleClass('highlight')
            }).mouseout(function(){
                $(this).toggleClass('highlight')
            })
        })

添加事件命名空间，便于管理

比如可以把为元素绑定的多个事件类型用命名空间规范起来，代码如下：

        $(function(){
            $('#btn').bind("mouseover.plugin",function(){
                $('#msg').text('加入了plugin~')
            }).bind("mouseout.plugin",function(){
                $('#msg').text('准备移除plugin')
                $(this).unbind(".plugin")
            }).click(function(){
                $(this).next().text('plugin事件消失~~')
            })
        })

代码演示

相同事件名称，不同命名方法

比如可以为元素绑定相同的事件，然后以命名空间的不同按需调用，代码如下：

$(function(){
            $('div').bind('click.plugin',function(){
                $('body').append('<p>click---plugin</p>')
            }).bind('click',function(){
                $('body').append('<p>click</p>')
            })
            $('#btn').click(function(){
                $('div').trigger("click!")//叹号的作用是匹配所有不包含在命名空间中的click方法
            })
        })

p.s带感叹号这个写法在1.9以上的版本已被废弃，这里只提供一种思路。