給大家分享的功能是layui自定義工具欄

創(chuàng)新互聯(lián)建站是一家專業(yè)提供北安企業(yè)網(wǎng)站建設(shè),專注與網(wǎng)站設(shè)計(jì)制作、網(wǎng)站制作、成都h5網(wǎng)站建設(shè)、小程序制作等業(yè)務(wù)。10年已為北安眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站建設(shè)公司優(yōu)惠進(jìn)行中。

功能效果：開啟數(shù)據(jù)表格頭部工具欄區(qū)域

關(guān)鍵參數(shù)：toolbar

參數(shù)類型：String/DOM/Boolean

參數(shù)說明：

toolbar: ‘#toolbarDemo' //指向自定義工具欄模板選擇器

toolbar: ‘

toolbar: true //僅開啟工具欄，不顯示左側(cè)模板

toolbar: ‘default' //讓工具欄左側(cè)顯示默認(rèn)的內(nèi)置模板

在這里我用的是第一種toolbar:'#toolbarDemo'，就是調(diào)用自己定義的工具欄的模板選擇器

功能效果圖：

已封裝好的自定義工具欄模板選擇器：

調(diào)用方法：

首先得引用jquery和layui的css樣式、js樣式

layui.use('table', function () {
 var table = layui.table;
 table.render({
 elem: '#table',
 url: 'SelectDepartment', //數(shù)據(jù)接口
 page: true, //開啟分頁
 cols: [[ //表頭
  { type: 'numbers', title: '序號', align: 'center', width: 100 },
  { field: 'DepartmentNumber', title: '部門編號', align: 'center' },
  { field: 'Department', title: '部門名稱', align: 'center' }
 ]],
 id: 'table',
 toolbar: '#toolbarDemo',//開啟自定義工具行，指向自定義工具欄模板選擇器
 defaultToolbar: ['filter', 'print', 'exports']
 });
});

上面的toolbar: '#toolbarDemo'這句代碼是這個功能的關(guān)鍵代碼

以上這篇layui自定義工具欄的方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持創(chuàng)新互聯(lián)。