使用Jquery添加表头和表尾

我有一个组合框

生成数据

将组合框绑定为表

我想为多列组合框添加页眉和页脚，并尝试冻结页眉和页脚。请建议

     $.each(ctrl.dropDown.$items, function (idx, item) {
            var header = '<thead><tr><td>Account Name</td><td>Account Number</td><td>Agreement Number</td></tr></thead>';

            var footer = '<tr><td colspan=3>'+idx+' items</td></tr>';
            $(item).empty();
            if (idx == 0) {
                $(item).prepend(header);
            }
            var tr = $('<tr/>');
            $.each(e.displayFields, function (dfdx, displayField) {
                var $td = $('<td/>').text(e.data[idx][displayField.fieldName]);
                //alert(e.data[idx][displayField.fieldName]);
                if (displayField.style != undefined) {
                    $td.attr('style', displayField.style);
                }
                $td.css('white-space', 'nowrap');
                tr.append($td);
            });
            var table = $('<table/>')   
                .attr({
                    'id':'tblComboList',
                    'cellpadding': '0px',
                    'cellspacing': '0px',
                    'width':'319px'
                });

            table.append(tr);
            if(idx ==0){
                table.prepend(header); //adding header but it is not freezed above table
            }
            $(item).append(table);
        });

$.each（ctrl.下拉菜单.$项，函数（idx，项）{
变量标题='帐户名称帐户编号通知编号'；
var footer=''+idx+'items'；
$（item.empty（）；
如果（idx==0）{
$（项目）.prepend（标题）；
}
var tr=$（''）；
$。每个（如显示字段、函数（dfdx、显示字段）{
var$td=$（''）.text（e.data[idx][displayField.fieldName]）；
//警报（例如数据[idx][displayField.fieldName]）；
if（displayField.style！=未定义）{
$td.attr（'style'，displayField.style）；
}
$td.css（'white-space'，'nowrap'）；
tr.1（td）；
});
变量表=$（''）
艾特先生({
“id”：“tblComboList”，
“cellpadding”：“0px”，
“单元格间距”：“0px”，
“宽度”：“319px”
});
表3.追加（tr）；
如果（idx==0）{
table.prepend（header）；//添加头，但它不会冻结在表上方
}
$（项目）。追加（表格）；
});
$（'body'）.empty（）；
var tempDataMain=[]；
tempDataMain.push（$（''）.append（$（''）.attr（{'id'：'tblComboList'，'cellpadding'：'0px'，'cellspacing'：'0px'，'width'：'319px'}））.html（）；
tempDataMain.push（'Account name Account NumberAgreement Number'）；
tempDataMain.push（“”）；
$.each（ctrl.下拉菜单.$项，函数（i，项）{
//tempDataMain.push（''+i+'项'）；
var$tr=$（''）；
$。每个（如显示字段、函数（j、显示字段）{
var$td=$（''）.text（e.data[i][displayField.fieldName]）；
if（displayField.style！=未定义&&displayField.style！=null）{
$td.attr（'style'，displayField.style）；
}
$tr.append（$td.css（'white-space'，'nowrap'））；
});
push（$（''）.append（$tr.html（））；
});
tempDataMain.push（“”）；
tempDataMain.push（“”）；
$（'body'）.append（tempDataMain.join（''）；
k。。这是可能的。你能给我看一下ctrl.下拉菜单的数据吗？以及你需要如何在html中最终输出…这里没有声明e数据的值。你可以显示完整的代码吗？你可以粘贴完整的代码，保存并粘贴注释中的链接…我需要ctrl.dropDown.$items和e的值。然后，您的最终输出html应该如何处理该数据。这样我就可以为你提供代码了。
$('body').empty();

var tempDataMain = [];
tempDataMain.push($('<div />').append($('<table />').attr({ 'id': 'tblComboList', 'cellpadding': '0px', 'cellspacing': '0px', 'width': '319px' })).html());
tempDataMain.push('<thead><tr><td>Account Name</td><td>Account Number</td><td>Agreement Number</td></tr></thead>');
tempDataMain.push('<tbody>');

$.each(ctrl.dropDown.$items, function (i, item) {
    //tempDataMain.push('<tr><td colspan="3">' + i + ' items</td></tr>');

    var $tr = $('<tr/>');
    $.each(e.displayFields, function (j, displayField) {
        var $td = $('<td/>').text(e.data[i][displayField.fieldName]);

        if (displayField.style != undefined && displayField.style != null) {
            $td.attr('style', displayField.style);
        }
        $tr.append($td.css('white-space', 'nowrap'));
    });

    tempDataMain.push($('<div />').append($tr).html());
});

tempDataMain.push('</tbody>');
tempDataMain.push('</table>');

$('body').append(tempDataMain.join(''));