jQuery仿Excel表格編輯功能的實作代碼_jquery

　　在 Excel 中可進行的操作，你幾乎都可以在網頁中做到，例如拖曳複製、Ctrl C 、Ctrl V 等等。

　　另外在瀏覽器支援方面，它支援以下的瀏覽器 IE7 , FF, Chrome, Safari, Opera。

如何使用：
     首先在頁面中引入jQuery 框架和Handsontable 插件的相關JS 和CSS 文件，以下列出的兩個是必要的，還有其它的是可選的，如果需要某個功能時就（參看demo）加上。

複製程式碼 程式碼如下:

   
   

　　接著新增一個用於呈現Excel 編輯表格的DIV 圖層

複製程式碼 程式碼如下:

　　最後就可以對其進行初始化了

複製程式碼 程式碼如下:

//資料
            var data = [
                      {id: 2, name : "約翰", isActive: false, 顏色: "黑色"},
              {id: 3, 姓名: "Al 名稱: "Ben", isActive: false, color: "blue"}
            ];
        unction (instance, td, row, col, prop, value, cellProperties) {
              Handsontable.TextCell.renderer.apply(this, argument);
              背景: '黃色'
              });
       //綠色渲染方法
            var greenRenderer = function (instance, td, row, col, prop, value,cellPropertcheap   ;
              $(td }).css({
                背景: '綠色'
                     // 初始化
            var $container = $("#範例1");              資料：數據，
          s: true,
              minSpareRows: 1,
          ”}，
                {data: "name", type: {renderer: YellowRenderer}}, //黃色渲染
   
                { 資料: "color",
                  type: Handsontable.AutocompleteCell, //自動完成者
   green", "blue", "gray", "black " , "white"] //資料來源
                }
          row, col, prop) {
                if (row === 0 && col === 0) {
                                  }
            });


注意是div容器載入完了之後進行初始化：

demo代碼：

複製程式碼 程式碼如下: