我可以销毁这个函数或 mousemove 事件吗？

Question

我可以销毁这个函数或 mousemove 事件吗？

我在 jQuery 中有一些让我头疼的代码。我在网上找到了这段代码，我在传递元素时为mousemove效果服务，但想知道当我离开他时如何补充或删除事件。

我的一个例子如下：

$("#icons").mouseenter(function(e) {
    $(this).find('div').slidemouse();
});

$("#icons").mouseleave(function(e) {
    $(this).find('div').slidemouse('destroy');
});

代码插件：

(function($) {
    $.fn.slidemouse=function(options) {
        var defaults=
            {
            height:'240px',
            widthExpand:true,
            mirror:false,
            mirrorOpacity:.3
        };
        var opts=$.extend(defaults,options);
        var expands=1;
        var galleryWidth=0;
        var self=this;
        self.css('overflow','hidden');
        self.children().css('height',opts.height);
        self.children().children().each(function(index) {
            galleryWidth=galleryWidth+$(this).outerWidth(true)
        }
        );
        if(opts.widthExpand) {
            while(galleryWidth<self.width()) {
                self.children().children(":nth-child("+expands+")").clone().appendTo(self.children());
                galleryWidth=galleryWidth+self.children().children(":nth-child("+expands+")").outerWidth(true);
                expands++
            }
        }
        self.children().css("width",galleryWidth);
        if(opts.mirror) {
            self.clone().insertAfter(self).attr("id","");
            self.next().fadeTo(0,opts.mirrorOpacity)
        }
        if(opts.widthExpand||opts.mirror) {
            $(window).bind("resize",resizeWindow)
        }
        function resizeWindow() {
            if(opts.widthExpand) {
                galleryWidth=0;
                self.children().children().each(function(index) {
                    galleryWidth=galleryWidth+$(this).outerWidth(true)
                });
                while(galleryWidth<self.width()) {
                    self.children().children(":nth-child("+expands+")").clone().appendTo(self.children());
                    galleryWidth=galleryWidth+self.children().children(":nth-child("+expands+")").outerWidth(true);
                    expands++
                }
                self.children().css("width",galleryWidth);
                if(opts.mirror) {
                    self.next().remove();
                    self.clone().insertAfter(self).attr("id","");
                    self.next().fadeTo(0,opts.mirrorOpacity)
                }
            }
        }
        $(this).parent().mousemove(function(e) {
            var x=e.pageX-this.offsetLeft;
            var calc=(self.children().width()-self.width())/self.width();
            var left=x*calc;
            var right=(self.width()-x)*calc;
            self.stop().animate({scrollLeft: left}, 500);
            if(opts.mirror) {
                self.next().stop().animate({scrollLeft: right}, 500);
            }
        })
    }
}
)(jQuery);

Answer 1

此插件没有针对您代码中需要的特定任务的方法。您可以绑定/取消绑定事件以防止插件的例程触发。适当时使用 $(this).unbind('event')。作为替代方案，您可以尝试通过添加销毁标志来修改插件的代码：

var defaults=
        {
        height:'240px',
        widthExpand:true,
        mirror:false,
        mirrorOpacity:.3,
        destroy: false
};

var opts=$.extend(defaults,options);
var self=this;

if(destroy) {

self.stop();
self.children().stop();

}

现在您可以将 mouseleave 上的新选项用作：

$(this).slidemouse({destroy: true});