jQuery事件绑定on、off 和one，取代bind, live, delegate

jQuery最新版建议：最好用on来代替以前的bind, live, delegate，其中live是最不建议使用的。

on和off的格式

on

$(elements).on(events[, selector][, data],handler);//格式一
$(elements).on(eventsMap[, selector][, data]);  //格式二

例如：

$('#container a').on({
    click: function(){
        event.preventDefault();
       console.log('item anchor clicked');
    },
    mouseenter: function(){
        console.log('enter!');
    }
});

off

$(elements).off(events[,selector][, handler] );

one

$(elements).one(events[, selector][, data],handler);//在每个对象上，这个事件处理函数只会被执行一次。可应用于后添加的元素

on代替bind,delegate,live

bind

// old way - .bind(events, handler);
$('#container a').bind('click',function(event){
    event.preventDefault();
    console.log('item anchor clicked');
});
// new way (jQuery 1.7+) - on(events, handler);
$('#container a').on('click',function(event){
    event.preventDefault();
    console.log('item anchor clicked');
});

live

// do not use! - .live(events, handler)
$('#container a').live('click',function(event){
    event.preventDefault();
    console.log('item anchor clicked');
});
// new way (jQuery 1.7+) - .on(events, selector, handler)
$('#container').on('click','a', function(event){
    event.preventDefault();
    console.log('item anchor clicked');
});

delegate

// old way - .delegate(selector, events, handler);
$('#container').delegate('a','click',function(event){
    event.preventDefault();
    console.log('item anchor clicked');
});
// new way (jQuery 1.7+) - on(events, selector, handler);
$('#container').on('click','a', function(event){
    event.preventDefault();
    console.log('item anchor clicked');
});

off代替unbind,undelegate,die

// old way - .bind(events);
$('#container a').unbind('click');
// new way (jQuery 1.7+) - off(events);
$('#container a').off('click');
$('#container a').off('click',handleClick);//取消绑定单独函数

// do not use! - .die(events)
$('#container a').die('click');
// new way (jQuery 1.7+) - .on(events, selector, handler)
$('#container').off('click','a');

// old way - .undelegate(selector, events);
$('#container').undelegate('a','click');
// new way (jQuery 1.7+) - off(events, selector);
$('#container').off('click','a');