成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

實現(xiàn)datatable表格第一列在手機端固定

Blackjun / 2332人閱讀

摘要:自用筆記,如有錯誤請指正。這點很關(guān)鍵,一開始我作出的效果整個都是不對齊的。這個選項空著列寬的時候,手機端好像并不適用,需要注意一下,所以才出現(xiàn)了中控制文字不換行這個操作,這一步也是官方文檔推薦的參考鏈接官方文檔

自用筆記,如有錯誤請指正。



@media (max-width: 767px) {

table.dataTable tbody th,
table.dataTable tbody td {
    white-space: nowrap;
}

}


$("#table_table").dataTable({

            "filter": false,
            "destroy": true,
            "lengthChange": true,
            "searching": false,
            "ordering": false,
            "stateSave": false,  // 不記住 狀態(tài)
            "bDestory": true,
            "info": true,
            "autoWidth": false,
            "serverSide": true,
            "processing": true,
            "scrollX": "1200px",
            //"scrollXInner": "500%",
            //"scrollX": true,//x方向滾動
            //"displayLength":"1200",
            "scrollCollapse": false, //可滾動控制y方向
            "fixedColumns": { //固定列的配置項
                leftColumns: 1, //固定左邊第一列
            //    rightColumns:1 //固定右邊第一列
            },

其中這兩個選項是關(guān)鍵,閱讀了官方文檔,scrollXInner這個選項已經(jīng)不建議使用,會引起表頭和表格對不齊這種問題,官方是為了維護用戶舊代碼才保留了這個選項。這點很關(guān)鍵,一開始我作出的效果整個都是不對齊的。
"scrollX": "",
"scrollXInner": "",

"aoColumnDefs": [

                { "sWidth": "20%", "aTargets": [ 1 ] }
            ],   

這個選項空著列寬的時候,手機端好像并不適用,需要注意一下,所以才出現(xiàn)了css中nowrap控制文字不換行這個操作,這一步也是官方文檔推薦的

參考鏈接官方文檔

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/103177.html

相關(guān)文章

  • DataTables表格插件使用說明

    摘要:簡介與的作用一樣,比更漂亮是一款表格插件。它是一個高度靈活的工具,可以將任何表格添加高級的交互功能。 DataTables簡介 與EasyUI的Datagrid作用一樣,比easyui更漂亮 Datatables是一款jquery表格插件。它是一個高度靈活的工具,可以將任何HTML表格添加高級的交互功能。 支持分頁、排序、搜索 支持4種數(shù)據(jù)源 支持多種主題 擁有多種擴展 文件引入 ...

    weij 評論0 收藏0
  • DataTables表格插件使用說明

    摘要:簡介與的作用一樣,比更漂亮是一款表格插件。它是一個高度靈活的工具,可以將任何表格添加高級的交互功能。 DataTables簡介 與EasyUI的Datagrid作用一樣,比easyui更漂亮 Datatables是一款jquery表格插件。它是一個高度靈活的工具,可以將任何HTML表格添加高級的交互功能。 支持分頁、排序、搜索 支持4種數(shù)據(jù)源 支持多種主題 擁有多種擴展 文件引入 ...

    bovenson 評論0 收藏0
  • DataTables表格插件使用說明

    摘要:簡介與的作用一樣,比更漂亮是一款表格插件。它是一個高度靈活的工具,可以將任何表格添加高級的交互功能。 DataTables簡介 與EasyUI的Datagrid作用一樣,比easyui更漂亮 Datatables是一款jquery表格插件。它是一個高度靈活的工具,可以將任何HTML表格添加高級的交互功能。 支持分頁、排序、搜索 支持4種數(shù)據(jù)源 支持多種主題 擁有多種擴展 文件引入 ...

    用戶84 評論0 收藏0
  • Datatables表格插件學(xué)習(xí)

    摘要:是一款表格插件。當(dāng)你打開服務(wù)器模式的時候,每次繪制表格的時候,會給服務(wù)器發(fā)送一個請求包括當(dāng)前分頁,排序,搜索參數(shù)等等。開啟服務(wù)器模式需要使用和不定時一講選項,進一步的信息,請參考下面的配置選項。 Datatables 是一款jquery表格插件。它是一個高度靈活的工具,可以將任何HTML表格添加高級的交互功能,可以很方便的實現(xiàn)分頁,即時搜索和排序。 一、簡單使用 怎樣簡單地使用Data...

    Lyux 評論0 收藏0
  • 后臺測試頁面使用說明

    摘要:此處需注意語句的假值問題四配置完畢本項目主要依賴于的表格插件的模態(tài)框 后臺測試頁面 一、簡述 對DataTables、jquery、jquery-ajax、熟悉的開發(fā)者可不必閱讀后端項目地址: Gsms_web_app頁面項目地址: Test_For_Backend 二、使用步驟(以meeting_user表為例) 傳遞參數(shù),自動生成,參數(shù)如下所示 { htmlPageName...

    nevermind 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<