js_top.htm

超强在线编辑表格 本程序是用JavaScript写的表格应用程序

    if(currentObject.tagName.toLowerCase() != "table" 
        && currentObject.tagName.toLowerCase() != "tbody" 
           && currentObject.tagName.toLowerCase() != "tr")
    {
        var currentTd   = getElement(currentObject,"td");
        if(currentTd==null) return;
        
        //modified 2004.04.09 更改点击图标，链接可以选择单行
        if (currentTd.children.length<=0 
            || currentTd.children[0].tagName.toLowerCase() == "a"
             || currentTd.children[0].tagName.toLowerCase() == "img")
        //end modified 2004.04.09 更改点击图标，链接可以选择单行
        {
            var currentTr   = currentTd.parentElement;
            var objTable = getElement(currentTd,"table");
            var i = 0;
            clearColor();
            currentRowIndex = currentTr.rowIndex;
            //设置选中的行
            if(currentRowIndex!=0)
            {
                for(i=0;i<currentTr.cells.length;i++)
                {
                    with(currentTr.cells[i])
                    {
                        style.backgroundColor=currentBgc;
                        style.color=currentFontColor;
                    }
                }
            }
        }

        //根据标记设置是否可编辑
        if(editbleFlag)
        {
            currentCell= currentTd;
                
            /*根据不同的设置进行编辑选择*/
            if(currentCell.children.length!=1 && currentCell.parentNode.rowIndex != 0)  
            {
                var cellN = currentCell.cellIndex;
                if(colStyle[parseInt(cellN)] == 'txt')
                    editCell(mainTab,currentCell,'txt',true);   
                else if(colStyle[parseInt(cellN)] == 'sel')
                    editCell(mainTab,currentCell,'sel',true,sText[parseInt(cellN)],sValue[parseInt(cellN)]);
                
                if(currentCell.children.length > 0)
                {
                    if(currentCell.children[0].type == "select-one")
                        currentCell.children[0].focus();
                    else
                        currentCell.children[0].select();
                }
            }
        }
    }

    selectRowProxy(currentRowIndex);
}

//增加点击一行时的代理动作，参数是选中当前行号
function selectRowProxy(currentRowIndex){}

//表格指定位置变为可编辑
//目前支持文本和下拉框
function editCell(oTable,oCell,editType,bEditable,sText,sValue)
{
    if (bEditable)
    {   
        switch(editType)
        {
            case 'txt':
                if(sText == null)
                    sText = true;
                oCell.innerHTML = "<input id=dyText type=text  size=10 onKeyDown = judgeKeyToDo() value=" 
                                  + oCell.innerText.replaceHTML() + ">";
                break;
            case 'sel':         
                var preValue = oCell.data;//获取当前表格的内容，在下拉框中选中
                for(var i=0; i<sValue.length; i++)
                {
                    //如果是原有表格的内容，则默认选中
                    if(sValue[i] == preValue)
                        optionText += "<option value='"+sValue[i]+"' selected>"+sText[i];
                    else                    
                        optionText += "<option value='"+sValue[i]+"'>"+sText[i];
                }
                oCell.innerHTML="<select id=powerTableSel onKeyDown = judgeKeyToDo()>"+optionText+"</select>";
                //为select的onchange指定事件
                oCell.children[0].onchange = selectChangeAction;
                //清空缓冲区
                optionText = "";
                break;
        }
    }
}

//向上移动指定表格的行
function Move_up(objTable)
{
    event.cancelBubble=true;
    if(currentRowIndex == null)
        return;

    if(currentRowIndex <= 1)
        return;
    else
    {
        MoveUp(objTable,currentRowIndex);
        //当前选择也上移
        --currentRowIndex;
    }
    setEvenOddColor(mainTab);
}

function Move_down(objTable)
{
    event.cancelBubble=true;
    if(currentRowIndex == null)
        return;
        
    if(currentRowIndex == mainTab.rows.length-1)
        return;
    else
    {
        MoveDown(objTable,currentRowIndex);
        //当前选择也下移
        ++currentRowIndex;
    }
    setEvenOddColor(mainTab);
}

function add_row(objTable) 
{
    event.cancelBubble=true;
    clearColor();
    var cellNow = cellData;
    //如果没选中行，则在表格的最下方插入
    var pos = currentRowIndex==null?objTable.rows.length:(currentRowIndex+1);
    addRow(objTable,pos,cellNow);

    currentCell=null;
    readDef(objTable);
    setEvenOddColor(mainTab);
    //清除设置的数据
    for(var i=0; i < mainTab.rows[0].cells.length; i++)
        cellData[i] = "&nbsp;";
}

//删除行，并处理当前选择项为不选择
function del_row(objTable) 
{
    if(currentRowIndex == null)
        return;

    if(confirm("确实要删除第"+currentRowIndex+"行吗?"))
    {
        delRow(objTable,currentRowIndex);
        currentRowIndex=null;
        currentCell=null;
        clearColor();
        setEvenOddColor(mainTab);
    }
}

function res_tab(objTable)
{
    objTable.outerHTML=orgContent;
    PowerTableEdit(objTable.id);
}

//在表格中指定位置,插入元素
function addRow(oTable,rowIndex2Add,c)
{
    if (rowIndex2Add<0 || rowIndex2Add>oTable.rows.length)
        return;
    var currentCell;
    var newRow=oTable.insertRow(rowIndex2Add);
    for (var i=0;i<c.length;i++) 
    {
        //modified by liu_xc 2004.6.28
        //增加一条数据时，如果时select形式的编辑方式，则搜索sValue和sText
        //找到与输入值相符的value赋给td的data
        if(colStyle[i] == "sel")
        {
            //如果没有设置数据而直接添加，会在编辑方式为
            //select的td中添加选择框数据的第一项
            if(c[i] == "&nbsp;" || c[i] == "")
                c[i] = sText[i][0];
            currentCell=newRow.insertCell(i);
            currentCell.innerHTML= c[i];
            for(var j=0; j<sText[i].length; j++)
            {
                if(c[i] == sText[i][j])
                {
                    currentCell.data= sValue[i][j];
                }
            }
        }
        else
        {
            currentCell=newRow.insertCell(i);
            currentCell.innerHTML= c[i];
        }
        //modified by liu_xc 2004.6.28
        //增加一条数据时，如果时select形式的编辑方式，则搜索sValue和sText
        //找到与输入值相符的value赋给td的data
    }
}

//删除指定行
function delRow(oTable,nRowIndex2Del)
{
    //不删除标题行；指定行不在表格中也不执行删除；
    if (oTable.rows.length==1
          ||nRowIndex2Del==null
            ||nRowIndex2Del==0
              || nRowIndex2Del>=oTable.rows.length) 
        return;
    else
        oTable.deleteRow(nRowIndex2Del);
}

function MoveUp(oTable,nRowIndex2Move)
{
    //判断移动的行是否合法
    if(nRowIndex2Move==null 
        || nRowIndex2Move<=1
            || nRowIndex2Move>=oTable.rows.length)return;
            
    ChangeRow(oTable,nRowIndex2Move,--nRowIndex2Move);
}

//向下移动指定表格的行
function MoveDown(oTable,nRowIndex2Move)
{
    //判断移动的行是否合法
    if(nRowIndex2Move==null 
        || currentRowIndex==oTable.rows.length 
            || currentRowIndex==0)
        return;
            
    ChangeRow(oTable,nRowIndex2Move,++nRowIndex2Move);
}

//指定表单的两行互换
function ChangeRow(oTable,nRowIndex1,nRowIndex2)
{
    oTable.rows[nRowIndex1].swapNode(oTable.rows[nRowIndex2]);
}

//获取指定tag的元素 [逐级查找] 
function getElement(oElement,sTag)
{
    sTag = sTag.toLowerCase();
    if(oElement.tagName.toLowerCase()==sTag)
        return oElement;
    while(oElement=oElement.offsetParent)
    {
        if(oElement.tagName.toLowerCase()==sTag) 
            return oElement;
    }
    return(null);
}

function ClearColor(oTable,nCurRowIndex,oCurCell)
{
    //清除选中行表现
    if(nCurRowIndex!=null && nCurRowIndex != -1)
    {
        for(i=0;i<oTable.rows[nCurRowIndex].cells.length;i++)
        {
            with(oTable.rows[nCurRowIndex].cells[i])
            {
                style.backgroundColor=oBgc;
                style.color=oFc;
            }
        }
    }
    //清除可编辑表格
    if(oCurCell!=null)
    {
        if (oCurCell.children.length>0 )
        {
            if(oCurCell.children[0].tagName.toLowerCase() != "img"
                &&oCurCell.children[0].tagName.toLowerCase() != "a")
            {
                if(oCurCell.children[0].tagName.toLowerCase() == "input")
                    oCurCell.innerHTML=oCurCell.children[0].value.replaceHTML();
                else if(oCurCell.children[0].tagName.toLowerCase() == "select")
                    oCurCell.innerHTML=oCurCell.children[0].options[oCurCell.children[0].selectedIndex].text;
            }
        }
    }
}

//读取表格现有颜色
function ReadOrgColor(oTable)
{
    for(var i=0;i<oTable.rows.length;i++)
    {
        for(var j=0;j<oTable.rows[i].cells.length;j++)
        {
            with(oTable.rows[i])
            {
                cells[j].oBgc = "";
                cells[j].oFc  = "";
            }
        }
    }
}

function setEvenOddColor(mainTab)
{
    //增加奇偶行的css控制 奇行：tdOdd，偶行：tdEven
    for(var i=1; i<mainTab.rows.length; i++)
    {
        if(i%2 == 0)
            mainTab.rows[i].className = "TrEven";
        else
            mainTab.rows[i].className = "TrOdd";
    }
}

//根据在编辑框按键的不同而采取不同的动作
function judgeKeyToDo()
{
    //按键是tab
    if(event.keyCode == 9)
    {
        var cellN;
        if(currentCell.cellIndex == mainTab.rows[currentRowIndex].cells.length-1)
            cellN = -1;
        else
            cellN = currentCell.cellIndex;
        var nextCell = mainTab.rows[currentRowIndex].cells[cellN+1];        
        //如果下一个表格未指定编辑方式，跳过
        while(colStyle[parseInt(cellN+1)] == null)
        {
            cellN = cellN + 1; 
            nextCell = mainTab.rows[currentRowIndex].cells[cellN+1];
        }
        //如果编辑方式为txt
        if(colStyle[parseInt(cellN+1)] == 'txt')
        {
            if(currentCell.children.length>0)
            {
                if(currentCell.children[0].tagName.toLowerCase() == "input")
                    currentCell.innerHTML=currentCell.children[0].value.replaceHTML();
                else if(currentCell.children[0].tagName.toLowerCase() == "select")
                    currentCell.innerHTML=currentCell.children[0].options[currentCell.children[0].selectedIndex].text;
            }
            editCell(mainTab,nextCell,'txt',true);
        }
        //如果编辑方式为select
        else if(colStyle[parseInt(cellN+1)] == 'sel')
        {
            if(currentCell.children.length>0)
            {
                if(currentCell.children[0].tagName.toLowerCase() == "input")
                    currentCell.innerHTML=currentCell.children[0].value.replaceHTML();
                else if(currentCell.children[0].tagName.toLowerCase() == "select")
                    currentCell.innerHTML=currentCell.children[0].options[currentCell.children[0].selectedIndex].text;
            }
            editCell(mainTab,nextCell,'sel',true,sText[parseInt(cellN+1)],sValue[parseInt(cellN+1)]);
        }
        //设置当前表格为下一个单元格
        currentCell = nextCell;
        
        if(currentCell.children.length > 0)
        {
            if(currentCell.children[0].type == "select-one")
                setTimeout('currentCell.children[0].focus()',10);
            else
                setTimeout('currentCell.children[0].select()',10);
        }
    }
    //如果按键是enter
    if(event.keyCode == 13)
    {
        if(currentCell.children[0].tagName.toLowerCase() == "input")