(function($){ var defaults = { // 是否可拖拽默认为true enable : true, // 要拖动的对象,默认为handle的父级的父级元素 target : null, // 回调 callback : { // move时的回调 onMove : function(e){ }, // drop时的回调 onDrop : function(e){ } } }; $.fn.name= function(options){ //name处为要绑定拖拽效果的对象名 var opts = $.extend({}, defaults, options); return this.each(function(){ if(opts.enable){ var $this = $(this); $this.bind(‘mousedown‘, function(e){ var target = opts.target || $this.parent().parent(), // 要拖拽的目标对象 height = target.outerHeight(), width = target.outerWidth(), offset = target.offset(), left = offset.left, top = offset.top, lastElemLeft = left, lastElemTop = top, // 拖动开始时记录下鼠标的位置以及要拖动对象的位置 data = { left : left, top : top, pageX : e.pageX, pageY : e.pageY }, // 辅助对象 help = $("<div></div>") .appendTo(document.body), $d = $(document), body = document.documentElement || document.body, cw = Math.max(body.scrollWidth, body.clientWidth), ch = Math.max(body.scrollHeight, body.clientHeight), // 拖动事件处理函数 handler = { move : function(e){ window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty(); left = lastElemLeft + e.pageX - e.data.pageX; top = lastElemTop + e.pageY - e.data.pageY; // 防止拖出 if(parseInt(left) < 0) left = 0; if(parseInt(top) < 0) top = 0; if(top > ch - height) top = ch - height; if(left > cw - width) left = cw - width; help.css({ left: left, top: top }); opts.callback.onMove(e); }, drop : function(e){ // 删除辅助对象 help.remove(); // 对目标对象进行定位 target.css({ left: left, top: top }); var shim = target.data("shim"); if(shim){ shim.css({ left: left, top: top }); } $d.unbind("mousemove", handler.move).css("cursor", ""); opts.callback.onDrop(e); } }; $d.css("cursor", "move"); /** 设置辅助div的样式 */ help.css({ height : target.outerHeight(), width : target.outerWidth(), border : "1px dotted #333", position : "absolute", zIndex : parseInt(target.css("z-index")) + 1, left : left, top : top }) /** 监听document的mousemove和mouseup */ $d.bind(‘mousemove‘, data, handler.move).bind(‘mouseup‘, data, handler.drop); }); } }); } })(jQuery);
时间: 2024-10-07 09:10:18