Skip to content

Latest commit

 

History

History
77 lines (68 loc) · 2.38 KB

README.md

File metadata and controls

77 lines (68 loc) · 2.38 KB
Raw

merge-table

HTML表格设计器可以快速的可视化设计一个表格，可以对单元格进行合并，拆分，添加，删除以及设置样式等操作，API简单易懂

###第一步:

grunt /*运行任务，生成js主文件*/

###第二步:

bower install /*安装依赖库*/

###第三步：

npm start /*运行项目*/

##API

  • merge 合并多个单元格 
    MergeTable.merge();
  • splitH 横拆单元格
    MergeTable.splitH();
  • splitV 竖拆单元格
    MergeTable.splitV();
  • deleteCol 删除列
    MergeTable.deleteCol();
  • deleteRow 删除行
    MergeTable.deleteRow();
  • addRowTop 在当前选中的单元格上方添加行
    MergeTable.addRowTop();
  • addRowBottom 在当前选中的单元格下方添加行
    MergeTable.addRowBottom();
  • addColLeft 在当前选中的单元格左侧添加列
    MergeTable.addColLeft();
  • addColRight 在当前选中的单元格右侧添加列
    MergeTable.addColRight();
  • init 初始化表格 
    
/*
tableContainer是表格的父容器
*/
var tableContainer = $("#tableContainer");
MergeTable.init("tableContainer", tableContainer.html());;
  • clearMerge 彻底拆分单元格
    MergeTable.clearMerge();
  • setSelectionCss 设置单元格样式 
    
/*
可以设置任意样式到选中的表格上
*/
MergeTable.setSelectionCss('background-color:#dfdfdf;');
  • read 以HTML文本的方式返回表格内容
    var htmlStr = MergeTable.read();
  • getSelectionCells 获取当前被选中的单元格
    var arr = MergeTable.getSelectionCells();

以及其他 ...

###演示示例 Alt text