FCKEditor中表格列以及多行列无法合并的解决办法

姜海龙 — Thu, 09 Aug 2007 10:47:00 GMT

FCKEditor2.4.2版本中并不支持列的合并，下面是原代码：

1FCKTableHandler.MergeCells = function()
2{
3    // Get all selected cells.
4    var aCells = FCKTableHandler.GetSelectedCells() ;
5
6    // At least 2 cells must be selected.
7    if ( aCells.length < 2 )
8        return ;
9
10    // The merge can occour only if the selected cells are from the same row.
11    if ( aCells[0].parentNode != aCells[aCells.length-1].parentNode )
12        return ;
13
14    // Calculate the new colSpan for the first cell.
15    var iColSpan = isNaN( aCells[0].colSpan ) ? 1 : aCells[0].colSpan ;
16
17    var sHtml = '' ;
18    var oCellsContents = FCK.EditorDocument.createDocumentFragment() ;
19
20    for ( var i = aCells.length - 1 ; i >= 0 ; i-- )
21    {
22        var eCell = aCells[i] ;
23
24        // Move its contents to the document fragment.
25        for ( var c = eCell.childNodes.length - 1 ; c >= 0 ; c-- )
26        {
27            var eChild = eCell.removeChild( eCell.childNodes[c] ) ;
28
29            if ( ( eChild.hasAttribute && eChild.hasAttribute('_moz_editor_bogus_node') ) || ( eChild.getAttribute && eChild.getAttribute( 'type', 2 ) == '_moz' ) )
30                continue ;
31
32                oCellsContents.insertBefore( eChild, oCellsContents.firstChild ) ;
33        }
34
35        if ( i > 0 )
36        {
37            // Accumulate the colspan of the cell.
38            iColSpan += isNaN( eCell.colSpan ) ? 1 : eCell.colSpan ;
39
40            // Delete the cell.
41            FCKTableHandler.DeleteCell( eCell ) ;
42        }
43    }
44
45    // Set the innerHTML of the remaining cell (the first one).
46    aCells[0].colSpan = iColSpan ;
47
48    if ( FCKBrowserInfo.IsGecko && oCellsContents.childNodes.length == 0 )
49        aCells[0].innerHTML = GECKO_BOGUS ;
50    else
51        aCells[0].appendChild( oCellsContents ) ;
52}

第10行代码对列合并做了限制，下面是修改的代码：

1FCKTableHandler.MergeCells = function()
2{
3    // Get all selected cells.
4    var aCells = FCKTableHandler.GetSelectedCells() ;
5
6    // At least 2 cells must be selected.
7    if ( aCells.length < 2 )
8        return ;
9
10    // The merge can occour only if the selected cells are from the same row.
11    //if ( aCells[0].parentNode != aCells[aCells.length-1].parentNode ){
12    //    alert("xx");
13    //    return ;
14    //}
15
16    //*********************************************************************
17    //在IE下合并单元格修改，主要针对上下单元格不能合并的问题。
18    //姜海龙
19    var iLen = aCells.length;
20    var iStartCol = aCells[0].cellIndex ;
21    var iStartRow = aCells[0].parentElement.rowIndex ;
22
23    var iEndCol = aCells[iLen-1].cellIndex ;
24    var iEndRow = aCells[iLen-1].parentElement.rowIndex ;
25
26    var eCells = new Array();
27    var j = 0;
28
29    for(var i = 0; i < iLen; i++){
30        if(aCells[i].cellIndex >= iStartCol && aCells[i].cellIndex <= iEndCol){
31            eCells[j] = aCells[i];
32            j++;
33        }
34    }
35
36    aCells[0].colSpan = iEndCol - iStartCol + 1;
37    aCells[0].rowSpan = iEndRow - iStartRow + 1;
38
39    for (var i = 1; i < j; i++){
40            eCells[i].parentElement.removeChild(eCells[i]);
41    }
42
43    //alert(aCells[0].rowSpan);
44    //alert(aCells[0].parentElement.parentElement.innerHTML);
45    //*********************************************************************
46
47
48}

该代码未经全面测试

姜海龙 2007-08-09 18:47 发表评论

BlogJava-You will be Success-随笔分类-JAVASCRIPT

FCKEditor中表格列以及多行列无法合并的解决办法