2016-10-06 6 views
0

ユーザーが行と列をマージできるときにテーブルを作成しようとしています。私は列のコードが正常に動作するようになっていますが、行もほとんどそこにあります。しかし、行間を3から2に変更すると、余分な列が追加されます。jQueryを使用してテーブル内の行スパンを動的に変更する

this fiddleの意味を理解できます。私は今、日間、この上してきたよう

function growRow(td, span, cell_content) { 
    var cell_content = (typeof cell_content === 'undefined') ? '<td></td>' : cell_content 
    var row = td.closest("tr") 
    var index = td.index() 
    var old_span = (typeof td.attr('rowspan') === 'undefined') ? 1 : Number(td.attr('rowspan')) 
    var table = row.parents('table') 
    var content 

    td.attr('rowspan', span) 

    if (span > old_span) { 
    // If we want to merge cells, this is easy 
    var selector = "tr:lt(" + (span - 1) + ")" 

    row.nextAll(selector).each(function() { 
     // Grab the content from each cell 
     content = $("td:eq(" + index + ")", $(this)).html() 
     $("td:eq(" + index + ")", $(this)).remove() 
    }) 

    // Get the next cell down 
    row = $('tr:eq('+ span +')') 
    // Append the content to make it look as though the cells are 'moving down' 
    row.find('td:eq('+ index +')').html(content) 
    } else { 
    // This is where I'm having problems 
    // Get the number of cells we need to put back 
    count = old_span - span 
    // Work through the rows 
    for (var i=0; i < count ; i++) { 
     // Get the row at the right index 
     r = $(row.nextAll()[i]) 
     if (index == 0) { 
     // If we're at the beginning of a row, we need to prepend 
     r.prepend(cell_content) 
     } else { 
     // Otherwise use nth-child to append in the right place 
     r.find('td:nth-child(' + index + ')').after(cell_content) 
     } 
    } 
    } 

    return td 
} 

すべてのヘルプは非常、いただければ幸いです。

そしてここでは、私のコードです!

答えて

1

r + countの行をオフセットする必要がありますか?ただrよりも?

+0

うん、そうだよ。私がする必要があったのは、オフセット(span - 1)を取得してインデックスに追加することでした。今すぐ完璧に動作します! https://jsfiddle.net/mojj9vvv/26/ – Pezholio

関連する問題