jquery datatable导出excel扩展插件使用

使用版本(datatable 1.10.12)

1.官网例子:

https://datatables.net/extensions/buttons/examples/html5/excelTextBold.html


需要导入:F12查看源文件

在实现了datatable基础上导入如下文件:

	
	

	
	
	

在原生成datatable的方法中加入标红部分:

$.collectList.namelistTable = $('#namelistTable').dataTable({
				 "aLengthMenu": [
				                    [10, 15, 20, -1],
				                    [10, 15, 20,30] // change per page values here
				                ],
		         "iDisplayLength": 10,
		         "data":namelist,
		         "sPaginationType": "bootstrap",
		         "bLengthChange": true,//改变每页显示数据数量
		         "bAutoWidth": false,//启用或禁用自动列宽度的计算。
		         "bFilter" : true,
		         'sScrollX': true,
		         'scrollX': true,
		         "bDestroy" : true,
		         "bServerSide" : false,
		         "bSortClasses" : false,
		         "bSort" : false,
		         'dom': 'Bfrtip',
		         'buttons': [
		            'excel'
		         ],
		         "oLanguage": {
		        	 "sProcessing": "正在加载中......",
		             "sLengthMenu": "每页显示: _MENU_",
		             "sZeroRecords": "对不起,查询不到相关数据!",
		             "sEmptyTable": "表中无数据存在!",
		             "sInfo": "当前显示 _START_ 到 _END_ 条,共 _TOTAL_ 条记录",
		             "sInfoFiltered": "数据表中共为 _MAX_ 条记录",
		             "sSearch": "搜索:",
		             "oPaginate": {
		                 "sFirst": "首页",
		                 "sPrevious": "上一页",
		                 "sNext": "下一页",
		                 "sLast": "末页"
		             }
		        },
		         "aoColumns": aoColumns
			});

刷新页面就能出现excel按钮,点击即可下载table内容;

注意:

官网:File export

buttons 里面的值为:copy csv excel pdf


你可能感兴趣的:(前端)