Datatables中文网

copyHtml5

起始版本号: Buttons 1.0.0

一个用来把表格数据复制到剪贴板的按钮(使用Html5)

注意：这个需要使用Bottons扩展

说明(Description)

这个按钮提供了一个简单的动作，把数据复制到剪贴板

使用 Buttons 1.0.0，在浏览器支持的前提下即可复制数据到剪贴板。 如下浏览器支持：

老版的浏览器（和Safari），或者是低版本的 Buttons，会提示用户用键盘或者Edit菜单来复制表格数据 到剪贴板，通过一个隐藏的 textareaTag，然后默认选中text实现。

当然也可以取消复制操作，在弹出的对话框里。

通过 languageOption 选项来配置提示用的信息。默认情况下为一下代码： 

{
    copy: 'Copy',
    copySuccess: {
        1: "Copied one row to clipboard",
        _: "Copied %d rows to clipboard"
    },
    copyTitle: 'Copy to clipboard',
    copyKeys: 'Press <i>ctrl</i> or <i>\u2318</i> + <i>C</i> to copy the table data<br>to your system clipboard.<br><br>To cancel, click this message or press escape.'
}

注意虽然这里取名为Html5 ，但实际上并不要Html5 API的支持。所以这种方式试用于所有支持Datatables的浏览器

选项(Options)

这个按钮有以下选项配置:

名称 默认
text Copy
按钮上显示的文字，使用 buttons.buttons.textOption 配置显示的文字内容 或者 buttons.copy,关于语言的配置参考 languageOption
className buttons-copy buttons-html5
按钮的class名称，详情参见 buttons.buttons.classNameOption
action
显示对话框，提示用户复制数据到剪贴板
fieldSeparator \t
用制表符来隔开数据复制到剪贴板中
fieldBoundary
The character(s) used to enclose each field in the plain text representation of the table that is copied to the system's clipboard. This is automatically added at the start and end of each cell's data.
exportOptions {}
选择性的导出数据，包括哪些列，行，排序或者过滤。 详细参考 方法，这里收集所需要的数据
header true
表头将包含在导出的数据中
footer false
表脚将包含在导出的数据中

示例

Datatables初始化：试用Html5按钮 

$('#myTable').DataTable( {
    buttons: [ 'copyHtml5' ]
} );

Datatables初始化：使用 copyButton ，让浏览器自动选择 

$('#myTable').DataTable( {
    buttons: [ 'copy' ]
} );

直接初始化：使用 exportOptions 选项配置只导出当前页 

$('#myTable').DataTable( {
    buttons: [
        {
            extend: 'copyHtml5',
            text: 'Copy current page',
            exportOptions: {
                modifier: {
                    page: 'current'
                }
            }
        }
    ]
} );

Datatables初始化：使用 languageOption 选项设置显示信息： 

$('#myTable').DataTable( {
    language:
        buttons: {
            copyTitle: 'Data copied',
            copyKeys: 'Use your keyboard or menu to select the copy command'
        }
    },
    buttons: [
        'copyHtml5'
    ]
} );

http://datatables.net/reference/button/copyHtml5

Translation from DataTables.net, with permission