首页 > 代码库 > jQuery插件 SlickGrid 复制单元格内容

jQuery插件 SlickGrid 复制单元格内容

2024-08-01 07:04:54   225人阅读

JSP代码

 1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2     pageEncoding="UTF-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 4 <html> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 7 <title>SlickGrid</title> 8  9 <link rel="stylesheet" href="./SlickGrid-master/slick.grid.css" type="text/css"/>10   <link rel="stylesheet" href="./SlickGrid-master/css/smoothness/jquery-ui-1.8.16.custom.css" type="text/css"/>11   <link rel="stylesheet" href="./SlickGrid-master/examples.css" type="text/css"/>12   <link rel="stylesheet" href="./SlickGrid-master/controls/slick.columnpicker.css" type="text/css"/>13 14 <script src="./SlickGrid-master/lib/firebugx.js"></script>15 16 <script src="./SlickGrid-master/lib/jquery-1.7.min.js"></script>17 <script src="./SlickGrid-master/lib/jquery-ui-1.8.16.custom.min.js"></script>18 <script src="./SlickGrid-master/lib/jquery.event.drag-2.2.js"></script>19 20 <script src="./SlickGrid-master/slick.core.js"></script>21 <script src="./SlickGrid-master/plugins/slick.checkboxselectcolumn.js"></script>22 <script src="./SlickGrid-master/plugins/slick.autotooltips.js"></script>23 <script src="./SlickGrid-master/plugins/slick.cellrangedecorator.js"></script>24 <script src="./SlickGrid-master/plugins/slick.cellrangeselector.js"></script>25 <script src="./SlickGrid-master/plugins/slick.cellcopymanager.js"></script>26 <script src="./SlickGrid-master/plugins/slick.cellselectionmodel.js"></script>27 <script src="./SlickGrid-master/plugins/slick.rowselectionmodel.js"></script>28 <script src="./SlickGrid-master/controls/slick.columnpicker.js"></script>29 <script src="./SlickGrid-master/slick.formatters.js"></script>30 <script src="./SlickGrid-master/slick.editors.js"></script>31 <script src="./SlickGrid-master/slick.grid.js"></script>32 <script src="./index.js"></script>33 </head>34 <body>35     <div id="myGrid" style="width:800px; height: 400px; border: 1px solid black; margin:auto;">36     </div>37 </body>38 </html>

js代码

 1 var grid; 2 var defaultcolumns = []; 3 var data =http://www.mamicode.com/ []; 4 var options = { 5  6 }; 7 $(function() { 8     data =http://www.mamicode.com/ getData(); 9     defaultcolumns = getColumns();10     11     grid = new Slick.Grid("#myGrid", data, defaultcolumns, options);12     13     var cellSelectionModel = new Slick.CellSelectionModel(options);14     grid.setSelectionModel(cellSelectionModel);15     var cellCopyManager =  new Slick.CellCopyManager();16     grid.registerPlugin(cellCopyManager);17     18     /*19      * copy20      */21     cellCopyManager.onCopyCells.subscribe(function(e,args){22         var cell = grid.getActiveCell();23         var cellvalue =http://www.mamicode.com/ grid.getDataItem(cell.row)[grid.getColumns()[cell.cell].field];24         window.clipboardData.setData("Text",cellvalue+"");25     });26 });27 28 function getData() {29     var data =http://www.mamicode.com/ [];30     for(var i = 0;i<1000;i++){31         data.push( {32             id : 10000000 + i,33             name : ‘name‘ + i,34             sex : i%2==0?‘男‘:‘女‘,35             age : parseInt(Math.random() * (50 - 20 + 1) + 20),36             phone : 1+""+ (parseInt(Math.random() * (9999999999 - 1000000000 + 1) + 1000000000)) + "",37             qq : parseInt(Math.random() * (1000000000 - 100000000 + 1) + 100000000) + ""38         });39     }40     return data;41 }42 43 function getColumns() {44     var columns = [];45     columns.push( {id:‘id‘,name:‘id‘,field:‘id‘,width:100});46     columns.push( {id:‘name‘,name:‘name‘,field:‘name‘,width:100});47     columns.push( {id:‘sex‘,name:‘sex‘,field:‘sex‘,width:80});48     columns.push( {id:‘age‘,name:‘age‘,field:‘age‘,width:80});49     columns.push( {id:‘phone‘,name:‘phone‘,field:‘phone‘,width:100});50     columns.push( {id:‘qq‘,name:‘qq‘,field:‘qq‘,width:100});51     return columns;52 }

 

jQuery插件 SlickGrid 复制单元格内容


联系
我们