日期:2014-05-16  浏览次数:20365 次

js 封装动态添加行之拖动

Utils = { //定义作用越

info : "Made by Ousui",

version : "0.0.0.1"

};

Utils.my = {

tableId : null, //添加tr所在的table

step : null, //在第几个tr后面添加

stepId : null, //记录添加行数的控件ID

html : null, //添加的格式

trNum : null, //从第几个tr后面加

hasDrag : null, //是否可以拖动

config : function(config) {

var obj = new Object(this);

obj.tableId = config.tableId, obj.step = config.step, obj.stepId = config.stepId, obj.trNum = config.trNum, obj.html = config.html

return obj;

},

addTr : function() { //添加行 ? ?

var StartTr = this.trNum - 1;

var newStep = $("#" + this.stepId + "").attr("value"); //每次的行号

var addStep = parseInt(newStep) + 1;

var addHtml = this.html.replace(/step/ig, addStep); //替换所有的step

$("#" + this.tableId + " tr:eq(" + StartTr + ")").after(addHtml);

if (this.hasDrag = true) { //添加拖动

this.drag(addStep);

}

$("#" + this.stepId + "").attr("value", addStep);

},

delTr : function(step) { //step ?当前的行号

$("tr[id=" + step + "]").remove();

},

drag : function(addStep) {

var onmousedown = false; //鼠标是否被按下

var oldlet = "";

var oldtop = "";

$("#" + addStep + "").live({

mouseover : function() { //鼠标移上事件

var $obj = jQuery(this);

$obj.css("color", "red");

$obj.css("cursor", "pointer");

$obj.css("position", "relative");

$obj.addClass("divStyle");

onmousedown = false;

},

mouseout : function() { //鼠标移去事件

var $obj = jQuery(this);

$obj.css("color", "");

$obj.removeClass("divStyle");

onmousedown = false;