日常開發(fā)者經(jīng)常會遇到的就是跟表格打交道，以下是一個(gè) 基于jQuery的表格合并單元格的方法

//合并單元格
; (function ($) {
    $.fn.madeRowspan = function (options) {
        var opts = $.extend({}, {
            cols: [0] //要進(jìn)行合并的列 0表示第一列
        }, options);
        $.fn.madeRowspan.options = opts;
        var $table = $(this), cols = opts.cols,$targetTr = $table.children('tbody').children('tr');
        $table.data('col-content', '');     // 存放單元格內(nèi)容
        $table.data('col-rowspan', 1);      // 存放計(jì)算的rowspan值 默認(rèn)為1
        $table.data('col-td', $());         // 存放發(fā)現(xiàn)的第一個(gè)與前一行比較結(jié)果不同td(jQuery封裝過的), 默認(rèn)一個(gè)"空"的jquery對象
        $table.data('trNum', $targetTr.length);     // 要處理表格的總行數(shù), 用于最后一行做特殊處理時(shí)進(jìn)行判斷之用
        if (cols != null) {
            for (var i = cols.length - 1; cols[i] != undefined; i--) {//合并單元格
                $targetTr.each(function (index) {
                    var $tr = $(this);
                    var $td = $('td:eq(' + cols[i] + ')', $tr);
                    var currentContent = $td.html();
                    if ($table.data('col-content') == '') {
                        $table.data('col-content', currentContent);
                        $table.data('col-td', $td);
                    } else {
                        // 上一行與當(dāng)前行內(nèi)容相同
                        if ($.trim($table.data('col-content')) == $.trim(currentContent)) {
                            var rowspan = $table.data('col-rowspan') + 1;
                            $table.data('col-rowspan', rowspan);
                            $td.hide();
                            if (++index == $table.data('trNum')) {//table 最后一行
                                $table.data('col-td').attr('rowspan', $table.data('col-rowspan')).show();
                            }
                        } else {
                            if ($table.data('col-rowspan') != 1) {
                                $table.data('col-td').attr('rowspan', $table.data('col-rowspan')).show();
                            }
                            // 保存第一次出現(xiàn)不同內(nèi)容的td, 和其內(nèi)容, 重置col-rowspan
                            $table.data('col-td', $td);
                            $table.data('col-content', $td.html());
                            $table.data('col-rowspan', 1);
                        }
                    }
                });
            }
        }
    }
})(jQuery);

用法:

$('selector').madeRowspan() //只合并第一列
$('selector').madeRowspan({cols:[0,1]})//只合并第一列，第二列