angularjs数据异步加载时的绑定事件

       // 顶级菜单项的鼠标移入和移出操作
            $(document).on({
                mouseover: function () {
                    var top = $(this).position().top + 24;
                    var left = $(this).position().left + 10;

                    if (top + $(this).children('ul').outerHeight(true) > $(window).height()) {
                        top -= $(this).children('ul').outerHeight(true) + 20;
                    }

                    $(this).children('ul').css({
                        top: top,
                        left: left
                    }).slideDown('fast');
                },
                mouseleave:function () {
                    $(this).children('ul').slideUp('fast');
                }
            }, ".menu>ul>li");

在需要为较多的元素绑定事件的时候,优先考虑事件委托,可以带来性能上的好处。

一、这种写法是把事件全部委托到document元素上,然后通过事件冒泡来执行函数,可以在同一类型的元素上绑定多个事件,只有当元素类型是指定的".menu>ul>li"时才会触发事件。

二、当指定class的元素未被加载时,js也不会报错。

posted @ 2015-10-13 11:21  望峰游云  阅读(631)  评论(0编辑  收藏  举报