datatable表格加水平滚动条

2019-05-27  本文已影响0人  cjlynn

1、配置

"scrollX":true,

"bAutoWidth":true,

2、table样式加上

white-space:nowrap;

3、重新加载一下表头

只加前2步正常情况下是没有问题的,如果需要点击事件隐藏显示表格内过长内容的话,表头还是无法对齐,这时候需要调用

rechargeTable.columns.adjust()

重新加载一下表头即可。

案例:

function createRowOfLengthContent(row, columnIndex, content, table) {

        var obj =$(row).children('td').eq(columnIndex);

        if(content.length >remarkShowLength){//只有超长,才有td点击事件

                $(obj).click(function(){

                        changeShowRemarks(obj, table);

                });

        }

        obj.css({"cursor":"pointer"}).attr('content', content);

};

function changeShowRemarks(obj, table){//obj是td

        var content =$(obj).attr("content");

        if(content !=null &&content !=''){

                if($(obj).attr("isDetail") =='true'){//当前显示的是详细备注,切换到显示部分

                        //$(obj).removeAttr('isDetail');//remove也可以

                        $(obj).attr('isDetail',false);

                        $(obj).html(getPartialRemarksHtml(content));

                }else{//当前显示的是部分备注信息,切换到显示全部

                        $(obj).attr('isDetail',true);

                        $(obj).html(getTotalRemarksHtml(content));

                        copyValueToClipBoard();

                }

        }

        table.columns.adjust();

}

上一篇下一篇

猜你喜欢

热点阅读