jquery中on/delegate的原理

jquery中on/delegate的原理

早期版本中叫delegate, 后来有过live函数，再后来统一用on。下面的方法等效：

    // jQuery 1.3
    $(selector).(events, data, handler);
    // jQuery 1.4.3+
    $(elements).delegate(selector, events, data, handler);
    // jQuery 1.7+ live过时 旧版本的jQuery中用户，应优先使用.delegate()来取代.live()
    $(elements).on(events, selector, data, handler);

代理的好处就是动态添加的元素，之前之前绑定的事件依然有效，直接使用bind是无法在这种情况下生效的。

代理事件其实就是利用了事件冒泡机制，给父元素绑定事件，在handler中判断target是否是期望的目标元素，然后做相应的处理。

    $(document).bind('click', function(e) {
        var ev = e || event;
        var target = $(ev.target || ev.srcElement);
        if (target.hasClass('btn')) {
            console.log('xxxx: ','you clicked btn');
            return false;
        }
        return true;
    });