通过鼠标位置控制BootstrapTable指定列的收缩/撑开显

场景：页面中有一个统计列表，其中有一列其内容较多，因此设计为正常情况下只显示对应字段的前5个字符加省略号，当鼠标划过时就显示完整内容，鼠标移走时又恢复简略显示。
注意，这里的完整“显示”不是指鼠标的tooltip悬浮文字提示，而是直接改变单元的内容文字。
以下为具体步骤：

1. 为表格添加特定css

.content-cell {
    text-align: left;
    display: block;
}

2、绑定单元格事件

function getSomeInfo() {
    $('#yourTableId').bootstrapTable({
        url: "/project/xxx/getXxx",   //接口名称
        method: 'post',
        contentType:"application/x-www-form-urlencoded",
        dataType: 'json',
        cache: false,
        async: false,
        queryParams:function queryParams(params) {   //设置查询参数
            var param = {
                pageSize: params.limit,   //每页多少条数据
                pageNumber: (params.offset / params.limit) + 1, //从第几页开始
            };
            return param;
        },
        responseHandler: function (res) {
            if (res.code == 200) {
                return res.data;
            } else {
                console.log(res)
                exceptionMessage(res);
            }
        },
        striped: true,                      //是否显示行间隔色
        pagination: true,                   //是否显示分页（*）
        sidePagination: "client",           //分页方式：client客户端分页，server服务端分页（*）
        pageNumber: 1,                      //初始化加载第一页，默认第一页
        pageSize: 5,                        //每页的记录行数（*）
        pageList: [5, 10],                  //可供选择的每页的行数（*）
        columns: [
            {title: "名称一", field: "fieldName1",align: "center"},
            {title: "名称二", field: "fieldName2",align: "center"},
            {title: "xx详情", field: "content",align: "center",
                formatter: function (value, row) {
                    // 只显示前5个字符
                    var shortContent = value.substring(0, 5) + '...';
                    // 指定CSS标记
                    return '<div class="content-cell" >' + shortContent + '</div>';
                },
                events: {  //绑定鼠标事件
                    'mouseover .content-cell': function (e, value, row, index) {
                        // 鼠标悬停时显示完整内容
                        var fullContent = value;
                        $(e.currentTarget).text(fullContent);
                    },
                    'mouseout .content-cell': function (e, value, row, index) {
                        // 鼠标移开时恢复缩写内容
                        var shortContent = value.substring(0, 5) + '...';
                        $(e.currentTarget).text(shortContent);
                    }
                }
            },
            {title: ...}
        ],
    });
}