jQuery Richtable

jQuery_Richtable.js

/**
* Project : PROWJ
* Comments : 表格
* Author : yeyi
* Create Date : 2010-4-15
* Modified By : yeyi
* Modified Date :  2012-2-28
*/

function RichTable(id) {
    this.tbId = "#" + id + " table";
    this.arrowElementHtml = "<div style='width:22px; height:22px; background:url(\"/images/list.gif\") no-repeat 0 0; opacity:0.8; filter:alpha(opacity=70); position:absolute; display:none;'></div>";
    this.copyElementHtml = "<div style='text-align:center; width:100px; height:20px; position:absolute; opacity:0.7; filter:alpha(opacity=60); display:none;'></div>";

    $(this.tbId).attr("cellpadding", "0");
    $(this.tbId).attr("cellspacing", "0");
    $(this.tbId).attr("border", "0");

    var idx = 0;
    $(this.tbId + " thead tr td").each(function () {
        $(this).attr("id", idx.toString());
        idx++;
    });

    var instance = this;

    $(instance.tbId + " thead tr td").bind("click", function () {
        if (!$(this).attr("SortFlag"))
            return;

        if ($(this).attr("class") != "selectable")
            onClickTableHeader(id, parseInt($(this).attr("SortFlag")) - 1);
    });
    $("#" + id + " div[class='pagination'] a").bind("click", function () {
        if ($(this).attr("class") != "current") {
            onClickPageLink(id, $(this).attr("PageIndex"));
            return false;
        }
    });

    //鼠标按下时表格元素突出显示
    $(instance.tbId + " tbody tr td").bind("mouseover", function () {
        $(this).parent().addClass("focus");
    });

    //鼠标移除时移除高亮
    $(instance.tbId + " tbody tr td").bind("mouseout", function () {
        $(this).parent().removeClass("focus");
    });

    //    this.executeWhenClickTableHeader = function (clickTableHeader) {
    //        $(instance.tbId + " thead tr td").bind("click", function () {
    //            if ($(this).attr("class") != "selectable")
    //                clickTableHeader(id, $(this).attr("name"));
    //        });
    //    }

    //    this.executeWhenClickPageLink = function (clickPageLink) {
    //        $("#" + id + " div[class='pagination'] a").bind("click", function () {
    //            if ($(this).attr("class") != "current")
    //                clickPageLink(id, $(this).attr("PageIndex"));
    //        });
    //    }
    
    //判断表格是否被选中，切换输入状态
    $(this.tbId + " thead td[class='selectable'] input").bind("click", function () {
        var checked = $(this).attr("checked") ? false : true;
        $(this).attr("checked", checked ? "" : "checked");
        $(instance.tbId + " tbody td[class='checkbox'] input").attr("checked", checked ? "" : "checked");
    });

    //操作选中并刷新
    this.operSelectedAndRefresh = function (confirmMsg, url) {
        var selectedValues = rtbl.getSelectedValues();

        if (selectedValues == "") {
            alert("您还未选中任何记录。");
            return;
        }

        if (confirmMsg)
            if (!confirm(confirmMsg))
                return;

        url = url.replace("{ids}", selectedValues);
        $.ajax({
            type: "post",
            dataType: "text/html",
            url: url,
            success: function (data) {
                if (data == "success")
                    location.reload();
            },
            error: function () {
            }
        });
    }

    //删除选中记录
    this.deleteSelected = function (deleteUrl) {
        var selectedValues = rtbl.getSelectedValues();

        if (selectedValues == "") {
            alert("您还未选中任何记录。");
            return;
        }

        if (!confirm("确认删除选中记录?"))
            return;

        deleteUrl = deleteUrl.replace("{ids}", selectedValues);
        $.ajax({
            type: "post",
            dataType: "text/html",
            url: deleteUrl,
            success: function (data) {
                if (data == "success")
                    location.reload();
            },
            error: function () {
            }
        });
    }

    //获取选中元素值
    this.getSelectedValues = function () {
        if ($(instance.tbId + " tbody td[class='checkbox'] input:checked").length == 0)
            return "";

        var result = "";
        $(instance.tbId + " tbody td[class='checkbox'] input:checked").each(function () {
            result += $(this).attr("value") + ",";
        });
        return result.substr(0, result.length - 1);
    };

    //允许拖放函数
    this.allowDragColumns = function () {
        
        //绑定拖拽事件
        this.bindDragEvents();

        //鼠标按下时，对事件进行判断
        $(document).bind("mouseup", function () {
            if (!instance.columnMoving)
                return;

            if (instance.afterColumn != null) {
                if (instance.moveToAfter) {
                    instance.moveColumn.insertAfter(instance.afterColumn);
                    for (var c = 0; c < $(instance.tbId + " tbody tr").length; c++)
                        $(instance.tbId + " tbody tr:eq(" + c + ") td:eq(" + instance.startIndex + ")").insertAfter($(instance.tbId + " tbody tr:eq(" + c + ") td:eq(" + instance.endIndex + ")"));
                }
                else {
                    instance.moveColumn.insertBefore(instance.afterColumn);
                    for (var c = 0; c < $(instance.tbId + " tbody tr").length; c++)
                        $(instance.tbId + " tbody tr:eq(" + c + ") td:eq(" + instance.startIndex + ")").insertBefore($(instance.tbId + " tbody tr:eq(" + c + ") td:eq(" + instance.endIndex + ")"));
                }

                instance.bindDragEvents();
            }

            $(instance.tbId).css("-moz-user-select", "");
            $(instance.tbId).css("-webkit-user-select", "");
            instance.arrowElement.css("display", "none");
            instance.copyElement.css("display", "none");
            instance.afterColumn = null;
            instance.columnMoving = false;
        });

        //鼠标放开后对事件
        $(document).bind("mousemove", function (event) {
            if (!instance.columnMoving)
                return;

            instance.copyElement.css("display", "block");
            instance.copyElement.css("left", event.pageX - parseInt(instance.copyElement.css("width")) / 2);
            instance.copyElement.css("top", event.pageY - parseInt(instance.copyElement.css("height")) / 2);

            var currentX = event.pageX;

            var findPrevOrNext = false;
            instance.moveToAfter = currentX > beginX;
            $(instance.tbId + " thead tr td").each(function (i) {
                if ($(this).attr("flag") != "copy") {
                    if ($(this).attr("id") != instance.moveColumn.attr("id")) {
                        var begin = $(this).offset().left;
                        var end = begin + $(this).width();

                        var enter = currentX >= begin && currentX <= end;

                        if (enter) {
                            if (instance.moveToAfter) {
                                instance.arrowElement.css("left", end - parseInt(instance.arrowElement.css("width")) / 2);
                                instance.arrowElement.css("display", "block");
                            } else {
                                instance.arrowElement.css("left", begin - parseInt(instance.arrowElement.css("width")) / 2);
                                instance.arrowElement.css("display", "block");
                            }

                            instance.afterColumn = $(this);
                            findPrevOrNext = true;
                            instance.endIndex = i;
                        }
                    }
                    else {
                        instance.startIndex = i;
                    }
                }
            });

            if (!findPrevOrNext) {
                instance.arrowElement.css("display", "none");
                instance.afterColumn = null;
            }
        });
    }

    //绑定拖拽事件函数
    this.bindDragEvents = function () {
        
        //开始选中后
        $(document).bind("selectstart", function () {
            return !instance.columnMoving;
        });

        //鼠标按下后对事件进行判断
        $(this.tbId + " thead tr td").bind("mousedown", function (event) {
            if (instance.columnMoving)
                return;
            
            //判断按钮是否被获取
            if (getButton(event) != 0)
                return;
            
            //判断是否选中文字
            if (getSelectionText() != "")
                return;
            
            //如果选中元素类为'cmd'或者'selectable'，则停止执行
            if ($(this).attr("class") == "cmd" || $(this).attr("class") == "selectable")
                return;
            
            //为不同浏览器下的table添加样式
            $(instance.tbId).css("-moz-user-select", "none");
            $(instance.tbId).css("-webkit-user-select", "none");
            
            
            instance.columnMoving = true;
            
            //获取移动元素
            instance.moveColumn = $(this);

            //判断箭头元素是否为空，如是则添加箭头元素Html
            if (instance.arrowElement == null) {
                instance.arrowElement = $(instance.arrowElementHtml);
                //将该元素添加至表格之后
                instance.arrowElement.insertAfter($(instance.tbId));
            }

            //            instance.arrowElement.css("top", $(instance.tbId).offset().top + $(document.documentElement).scrollTop() - parseInt(instance.arrowElement.css("height")) + 5);
            
            //设置箭头元素的CSS，top值为表格高度减去箭头元素然后下移5个px
            instance.arrowElement.css("top", $(instance.tbId).offset().top - parseInt(instance.arrowElement.css("height")) + 5);

            //判断复制的元素为空，如是则添加复制元素Html
            if (instance.copyElement == null) {
                instance.copyElement = $(instance.copyElementHtml);
               
                //将复制元素添加至表格后面
                instance.copyElement.insertAfter($(instance.tbId));
            }

            //获取移动中元素的html文档
            instance.copyElement.html(instance.moveColumn.html());
            //            instance.copyElement.css("top", $(instance.tbId).offset().top + $(document.documentElement).scrollTop() - parseInt(instance.copyElement.css("height")) + 5);
            
            //设置复制文字的CSS属性
            instance.copyElement.css("top", $(instance.tbId).offset().top - parseInt(instance.copyElement.css("height")) + 5);

            //获取元素相对文件左侧位置并赋值至begingX
            beginX = event.pageX;
        });
    }
} 

//获取选中文字
function getSelectionText() {
    
    //判断浏览器类型
    if ($.browser.msie) {
        return document.selection.createRange().text;
    } else {
        return window.getSelection();
    }
}

//获取按钮函数
function getButton(e) {
    var clickButton = e.button;
    var newMap = { 1: 0, 4: 1, 2: 2 }

    return $.browser.msie ? newMap[clickButton] : clickButton;
}

有谁能够帮忙看看这段代码吗？