自各儿写的一个简易块元素拖动js工具，散分

自己写的一个简易块元素拖动js工具，散分

/**
 * create by   : zhouwn
 * create date : 2013-07-27
 * namespace   : dragUtil 
 * description : html元素拖动功能js工具包，让元素具备拖动和解除拖动功能
 *               拖放的核心在于鼠标左键的按下，移动，和松开事件的控制，该js第一版未使用jq
 * version     : v0.901    
 */

var dragUtil = {};//拖放工具命名空间

/**
 * 让目标元素具备拖放功能 
 * @param {Object} obj 目标元素
 */
dragUtil.enableDrag = function(obj){
obj.enableDrag = false;//需扩展一个用于控制是否可以拖放的flag属性
obj.style.position = "absolute";//目标元素样式中的position属性需设置为：absolute
obj.onmousedown = dragUtil.initDrag;//鼠标按下事件绑定
obj.onmousemove = dragUtil.doDrag;//鼠标移动事件绑定
obj.onmouseup = dragUtil.endDrag;//鼠标松开事件绑定
}

/**
 * 移除目标元素的拖放功能 
 * @param {Object} obj 目标元素
 */
dragUtil.disableDrag = function(obj){
//移除控制属性
obj.enableDrag = undefined;
obj.srcCoord = undefined;
//移除事件绑定
obj.onmousedown = undefined;
obj.onmousemove = undefined;
obj.onmouseup = undefined;
}

/**
 * 初始化拖放 
 * @param {Object} e 事件对象
 */
dragUtil.initDrag = function(e){
var event = e || window.event;//FF获取事件对象 ||IE获取事件对象
var element = event.target || event.srcElement;//FF获取事件源 ||IE获取事件源
//鼠标左右键e.button(0标识左键，1标识中键，2标识右键，FF IE均如此)
if(event.button == 0){
element.enableDrag = true;//开启可移动flag
element.srcCoord = {x : event.clientX , y : event.clientY};//记录鼠标当前坐标
}
}

/**
 * 结束拖放 
 * @param {Object} e 事件对象
 */
dragUtil.endDrag = function(e){
var event = e || window.event;//FF IE
var element = event.target || event.srcElement;//FF IE
if(event.button == 0){
element.enableDrag = false;//拖放flag置为false
}
}

/**
 * 执行拖放
 * @param {Object} e 事件对象
 */
dragUtil.doDrag = function(e){
var event = e || window.event;//FF IE
var element = event.target || event.srcElement;//FF IE
//检测是否可以拖动
if(element.enableDrag){ 
 
element.style.left = (element.offsetLeft + event.clientX - element.srcCoord.x) + "px";
element.style.top = (element.offsetTop + event.clientY - element.srcCoord.y) + "px";
element.srcCoord.x = event.clientX;//更新坐标位置x
element.srcCoord.y = event.clientY;//更新坐标位置y
}
}