dataTables的鼠标移入移出，分割内容

/*鼠标移入移出*/

<style type="text/css">

    table{

        table-layout: fixed;

    }

    .msgtable{

        overflow: hidden;/*内容超出宽度会隐藏超出部分*/

        word-break: keep-all;/*不换行*/

        white-space: nowrap;/*不换行*/

        text-overflow: ellipsis;

 

    }

    .msgtable:hover{

        overflow: unset ;

        white-space: unset ;

        text-overflow: unset !important;

        word-break: break-all;

 

        /*overflow: auto;//滚动条*/

        /*overflow: inherit;  // 鼠标移入显示所有*/

        /*overflow: scroll;//滚动条*/

        /*overflow: visible;// 鼠标移入显示所有*/

 

    }

    .srctable{

        word-wrap:break-word;

    }

</style>

 

 

 "columns": [

                {"data": "tag", "bSortable": true},

                {"data": "msg", "bSortable": false,class:"msgtable"},  //鼠标移除，超出表格宽度的内容用...代替，鼠标移入显示全部内容

                {"data": "src", "bSortable": false,class:"srctable"},

                {"data": "nickname", "bSortable": true},

                {"data": "updatedAt", "bSortable": true},

                {"data": "ip", "bSortable": true},

                {"data": "status", "bSortable": true}

            ]

            ,

            "columnDefs": [

                {

                    "render": function (data, type, row) {   //只显示表格里指定的某一部分内容

                        var subdata=data;

                        if(data.length>30){

                            subdata = data.substr(data.lastIndexOf(".") + 1);

                        }

                        return "<a title='"+data+"' href='javascript:;'>"+subdata+"</a>";

                    },

                    "targets": 2

                }