merge-table

KO | EN

gitlite — search

#javascript #hacktoberfest #ai #typescript #golang #android #machine-learning #linux #macos #java #windows #awesome #ios #open-source

(★ 17)

对HTML表格进行合并拆分操作

merge-table 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

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

###第一步:
<pre><code>grunt /*运行任务，生成js主文件*/</code></pre>

###第二步:
<pre><code>bower install /*安装依赖库*/</code></pre>

###第三步：
<pre><code>npm start /*运行项目*/</code></pre>

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

</ul>

以及其他 ...

###演示示例
![Alt text](https://raw.githubusercontent.com/huanghaiyang/merge-table/master/sample.gif)

merge-table

merge-table 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

merge-table

merge-table 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README