DataTable知识

一、DataTable列太多，使用省略

$(document).ready(function () {
        //数据表格处理
        var table = $('#dataTable').DataTable({
            ajaxSource: "${ctx}/cust/industrybase/search",
            columns: [
                {data: "","width":"80px"},
                {data: "contactPersonName","width":"80px"},
                {data: "contactPersonPhone","width":"90px"},
                {data: "contactPersonMail","width":"90px"},
                {data: "personnelCategroy","width":"60px"},
                {data: "statusCode","width":"60px"},
                {data: "expertPosition","width":"150px",render: function( data, type, full, meta ) {
                    if(data){
                        if(data.length>20){
                            return "<span title='"+data+"'>"+ data.substr(0, 6) + "...</span>";
                        }else{
                            return data;
                        }
                    }else{
                        return "";
                    }
                }},
                {data: "expertField","width":"90px"},
                {data: "expertIntroduce","width":"150px", render: function( data, type, full, meta ) {
                    if(data){
                        if(data.length>20){
                            return "<span title='"+data+"'>"+ data.substr(0, 6) + "...</span>";
                        }else{
                            return data;
                        }
                    }else{
                        return "";
                    }
                }}
            ],
            columnDefs: [
                {
                    orderable: false,
                    className: 'select-checkbox',
                    targets: 0
                },
                {
                    defaultContent: "",
                    targets: "_all"
                }
            ],
            select: {
                style: 'multi',
                selector: 'td:first-child'
            },
            order: [[5, 'desc']]
        });

        table.buttons(0, null ).container().appendTo('#data-table-buttons');

        //自定义业务功能（自行增加）
    });

禁用排序：orderable : false

 

二、列数据太多使用省略号：http://www.manongjc.com/detail/19-wktxoojsqjyddil.html

三、序号按行号排：https://www.cnblogs.com/yang-xiansen/p/9927721.html

四、获取指定的行数据：https://www.cnblogs.com/hdwang/p/7126796.html

五、列中插入图片：https://www.jianshu.com/p/b06952e7cde6

六、DataTable点击图片放大：https://blog.csdn.net/weixin_42630616/article/details/103136485

七、css选择器：https://www.w3school.com.cn/cssref/css_selectors.asp

 　   css样式有：行内样式，内部样式，外部样式。

八、使用js获取input自定义属性

　　根据id获取自定义属性：document.getElementById("idName").getAttribute('data-code');

　　根据name获取自定义属性：document.getElementsByName("Name")[0].getAttribute("data-code")

九、获取屏幕宽度总结

　　参考：https://www.cnblogs.com/mlw1814011067/p/9504282.html

　　js获取元素的页面坐标：https://www.cnblogs.com/12jh23/p/6369561.html

　　js获取元素页面的位置：http://www.ruanyifeng.com/blog/2009/09/find_element_s_position_using_javascript.html

十、获取元素坐标（距离屏幕左侧和上侧的距离）：https://blog.csdn.net/tanga842428/article/details/78213427

jq获取元素的坐标值：
//div相当于窗口的左边的偏移量
var left = $("#div").offset().left;
//相当于窗口的顶部的偏移量
var top = $("#div").offset().top;

js获取元素的坐标值
使用offsetLeft和offsetTop属性

十一、DataTable参数设置：https://www.cnblogs.com/songrimin/p/6497987.html