table.js 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717
  1. /*******************************************************************************
  2. * KindEditor - WYSIWYG HTML Editor for Internet
  3. * Copyright (C) 2006-2011 kindsoft.net
  4. *
  5. * @author Roddy <luolonghao@gmail.com>
  6. * @site http://www.kindsoft.net/
  7. * @licence http://www.kindsoft.net/license.php
  8. *******************************************************************************/
  9. KindEditor.plugin('table', function(K) {
  10. var self = this, name = 'table', lang = self.lang(name + '.'), zeroborder = 'ke-zeroborder';
  11. // 取得下一行cell的index
  12. function _getCellIndex(table, row, cell) {
  13. var rowSpanCount = 0;
  14. for (var i = 0, len = row.cells.length; i < len; i++) {
  15. if (row.cells[i] == cell) {
  16. break;
  17. }
  18. rowSpanCount += row.cells[i].rowSpan - 1;
  19. }
  20. return cell.cellIndex - rowSpanCount;
  21. }
  22. self.plugin.table = {
  23. //insert or modify table
  24. prop : function(isInsert) {
  25. var html = [
  26. '<div style="padding:10px 20px;">',
  27. //rows, cols
  28. '<div class="ke-dialog-row">',
  29. '<label for="keRows" style="width:90px;">' + lang.cells + '</label>',
  30. lang.rows + ' <input type="text" id="keRows" class="ke-input-text ke-input-number" name="rows" value="" maxlength="4" /> &nbsp; ',
  31. lang.cols + ' <input type="text" class="ke-input-text ke-input-number" name="cols" value="" maxlength="4" />',
  32. '</div>',
  33. //width, height
  34. '<div class="ke-dialog-row">',
  35. '<label for="keWidth" style="width:90px;">' + lang.size + '</label>',
  36. lang.width + ' <input type="text" id="keWidth" class="ke-input-text ke-input-number" name="width" value="" maxlength="4" /> &nbsp; ',
  37. '<select name="widthType">',
  38. '<option value="%">' + lang.percent + '</option>',
  39. '<option value="px">' + lang.px + '</option>',
  40. '</select> &nbsp; ',
  41. lang.height + ' <input type="text" class="ke-input-text ke-input-number" name="height" value="" maxlength="4" /> &nbsp; ',
  42. '<select name="heightType">',
  43. '<option value="%">' + lang.percent + '</option>',
  44. '<option value="px">' + lang.px + '</option>',
  45. '</select>',
  46. '</div>',
  47. //space, padding
  48. '<div class="ke-dialog-row">',
  49. '<label for="kePadding" style="width:90px;">' + lang.space + '</label>',
  50. lang.padding + ' <input type="text" id="kePadding" class="ke-input-text ke-input-number" name="padding" value="" maxlength="4" /> &nbsp; ',
  51. lang.spacing + ' <input type="text" class="ke-input-text ke-input-number" name="spacing" value="" maxlength="4" />',
  52. '</div>',
  53. //align
  54. '<div class="ke-dialog-row">',
  55. '<label for="keAlign" style="width:90px;">' + lang.align + '</label>',
  56. '<select id="keAlign" name="align">',
  57. '<option value="">' + lang.alignDefault + '</option>',
  58. '<option value="left">' + lang.alignLeft + '</option>',
  59. '<option value="center">' + lang.alignCenter + '</option>',
  60. '<option value="right">' + lang.alignRight + '</option>',
  61. '</select>',
  62. '</div>',
  63. //border
  64. '<div class="ke-dialog-row">',
  65. '<label for="keBorder" style="width:90px;">' + lang.border + '</label>',
  66. lang.borderWidth + ' <input type="text" id="keBorder" class="ke-input-text ke-input-number" name="border" value="" maxlength="4" /> &nbsp; ',
  67. lang.borderColor + ' <span class="ke-inline-block ke-input-color"></span>',
  68. '</div>',
  69. //background color
  70. '<div class="ke-dialog-row">',
  71. '<label for="keBgColor" style="width:90px;">' + lang.backgroundColor + '</label>',
  72. '<span class="ke-inline-block ke-input-color"></span>',
  73. '</div>',
  74. '</div>'
  75. ].join('');
  76. var picker, currentElement;
  77. function removePicker() {
  78. if (picker) {
  79. picker.remove();
  80. picker = null;
  81. currentElement = null;
  82. }
  83. }
  84. var dialog = self.createDialog({
  85. name : name,
  86. width : 500,
  87. height : 300,
  88. title : self.lang(name),
  89. body : html,
  90. beforeDrag : removePicker,
  91. beforeRemove : function() {
  92. removePicker();
  93. colorBox.unbind();
  94. },
  95. yesBtn : {
  96. name : self.lang('yes'),
  97. click : function(e) {
  98. var rows = rowsBox.val(),
  99. cols = colsBox.val(),
  100. width = widthBox.val(),
  101. height = heightBox.val(),
  102. widthType = widthTypeBox.val(),
  103. heightType = heightTypeBox.val(),
  104. padding = paddingBox.val(),
  105. spacing = spacingBox.val(),
  106. align = alignBox.val(),
  107. border = borderBox.val(),
  108. borderColor = K(colorBox[0]).html() || '',
  109. bgColor = K(colorBox[1]).html() || '';
  110. if (rows == 0 || !/^\d+$/.test(rows)) {
  111. alert(self.lang('invalidRows'));
  112. rowsBox[0].focus();
  113. return;
  114. }
  115. if (cols == 0 || !/^\d+$/.test(cols)) {
  116. alert(self.lang('invalidRows'));
  117. colsBox[0].focus();
  118. return;
  119. }
  120. if (!/^\d*$/.test(width)) {
  121. alert(self.lang('invalidWidth'));
  122. widthBox[0].focus();
  123. return;
  124. }
  125. if (!/^\d*$/.test(height)) {
  126. alert(self.lang('invalidHeight'));
  127. heightBox[0].focus();
  128. return;
  129. }
  130. if (!/^\d*$/.test(padding)) {
  131. alert(self.lang('invalidPadding'));
  132. paddingBox[0].focus();
  133. return;
  134. }
  135. if (!/^\d*$/.test(spacing)) {
  136. alert(self.lang('invalidSpacing'));
  137. spacingBox[0].focus();
  138. return;
  139. }
  140. if (!/^\d*$/.test(border)) {
  141. alert(self.lang('invalidBorder'));
  142. borderBox[0].focus();
  143. return;
  144. }
  145. //modify table
  146. if (table) {
  147. if (width !== '') {
  148. table.width(width + widthType);
  149. } else {
  150. table.css('width', '');
  151. }
  152. if (table[0].width !== undefined) {
  153. table.removeAttr('width');
  154. }
  155. if (height !== '') {
  156. table.height(height + heightType);
  157. } else {
  158. table.css('height', '');
  159. }
  160. if (table[0].height !== undefined) {
  161. table.removeAttr('height');
  162. }
  163. table.css('background-color', bgColor);
  164. if (table[0].bgColor !== undefined) {
  165. table.removeAttr('bgColor');
  166. }
  167. if (padding !== '') {
  168. table[0].cellPadding = padding;
  169. } else {
  170. table.removeAttr('cellPadding');
  171. }
  172. if (spacing !== '') {
  173. table[0].cellSpacing = spacing;
  174. } else {
  175. table.removeAttr('cellSpacing');
  176. }
  177. if (align !== '') {
  178. table[0].align = align;
  179. } else {
  180. table.removeAttr('align');
  181. }
  182. if (border !== '') {
  183. table.attr('border', border);
  184. } else {
  185. table.removeAttr('border');
  186. }
  187. if (border === '' || border === '0') {
  188. table.addClass(zeroborder);
  189. } else {
  190. table.removeClass(zeroborder);
  191. }
  192. if (borderColor !== '') {
  193. table.attr('borderColor', borderColor);
  194. } else {
  195. table.removeAttr('borderColor');
  196. }
  197. self.hideDialog().focus();
  198. return;
  199. }
  200. //insert new table
  201. var style = '';
  202. if (width !== '') {
  203. style += 'width:' + width + widthType + ';';
  204. }
  205. if (height !== '') {
  206. style += 'height:' + height + heightType + ';';
  207. }
  208. if (bgColor !== '') {
  209. style += 'background-color:' + bgColor + ';';
  210. }
  211. var html = '<table';
  212. if (style !== '') {
  213. html += ' style="' + style + '"';
  214. }
  215. if (padding !== '') {
  216. html += ' cellpadding="' + padding + '"';
  217. }
  218. if (spacing !== '') {
  219. html += ' cellspacing="' + spacing + '"';
  220. }
  221. if (align !== '') {
  222. html += ' align="' + align + '"';
  223. }
  224. if (border !== '') {
  225. html += ' border="' + border + '"';
  226. }
  227. if (border === '' || border === '0') {
  228. html += ' class="' + zeroborder + '"';
  229. }
  230. if (borderColor !== '') {
  231. html += ' bordercolor="' + borderColor + '"';
  232. }
  233. html += '>';
  234. for (var i = 0; i < rows; i++) {
  235. html += '<tr>';
  236. for (var j = 0; j < cols; j++) {
  237. html += '<td>' + (K.IE ? '&nbsp;' : '<br />') + '</td>';
  238. }
  239. html += '</tr>';
  240. }
  241. html += '</table>';
  242. if (!K.IE) {
  243. html += '<br />';
  244. }
  245. self.insertHtml(html);
  246. self.select().hideDialog().focus();
  247. self.addBookmark();
  248. }
  249. }
  250. }),
  251. div = dialog.div,
  252. rowsBox = K('[name="rows"]', div).val(3),
  253. colsBox = K('[name="cols"]', div).val(2),
  254. widthBox = K('[name="width"]', div).val(100),
  255. heightBox = K('[name="height"]', div),
  256. widthTypeBox = K('[name="widthType"]', div),
  257. heightTypeBox = K('[name="heightType"]', div),
  258. paddingBox = K('[name="padding"]', div).val(2),
  259. spacingBox = K('[name="spacing"]', div).val(0),
  260. alignBox = K('[name="align"]', div),
  261. borderBox = K('[name="border"]', div).val(1),
  262. colorBox = K('.ke-input-color', div);
  263. function setColor(box, color) {
  264. color = color.toUpperCase();
  265. box.css('background-color', color);
  266. box.css('color', color === '#000000' ? '#FFFFFF' : '#000000');
  267. box.html(color);
  268. }
  269. setColor(K(colorBox[0]), '#000000');
  270. setColor(K(colorBox[1]), '');
  271. function clickHandler(e) {
  272. removePicker();
  273. if (!picker || this !== currentElement) {
  274. var box = K(this),
  275. pos = box.pos();
  276. picker = K.colorpicker({
  277. x : pos.x,
  278. y : pos.y + box.height(),
  279. z : 811214,
  280. selectedColor : K(this).html(),
  281. colors : self.colorTable,
  282. noColor : self.lang('noColor'),
  283. shadowMode : self.shadowMode,
  284. click : function(color) {
  285. setColor(box, color);
  286. removePicker();
  287. }
  288. });
  289. currentElement = this;
  290. }
  291. }
  292. colorBox.click(clickHandler);
  293. // foucs and select
  294. rowsBox[0].focus();
  295. rowsBox[0].select();
  296. var table;
  297. if (isInsert) {
  298. return;
  299. }
  300. //get selected table node
  301. table = self.plugin.getSelectedTable();
  302. if (table) {
  303. rowsBox.val(table[0].rows.length);
  304. colsBox.val(table[0].rows.length > 0 ? table[0].rows[0].cells.length : 0);
  305. rowsBox.attr('disabled', true);
  306. colsBox.attr('disabled', true);
  307. var match,
  308. tableWidth = table[0].style.width || table[0].width,
  309. tableHeight = table[0].style.height || table[0].height;
  310. if (tableWidth !== undefined && (match = /^(\d+)((?:px|%)*)$/.exec(tableWidth))) {
  311. widthBox.val(match[1]);
  312. widthTypeBox.val(match[2]);
  313. } else {
  314. widthBox.val('');
  315. }
  316. if (tableHeight !== undefined && (match = /^(\d+)((?:px|%)*)$/.exec(tableHeight))) {
  317. heightBox.val(match[1]);
  318. heightTypeBox.val(match[2]);
  319. }
  320. paddingBox.val(table[0].cellPadding || '');
  321. spacingBox.val(table[0].cellSpacing || '');
  322. alignBox.val(table[0].align || '');
  323. borderBox.val(table[0].border === undefined ? '' : table[0].border);
  324. setColor(K(colorBox[0]), K.toHex(table.attr('borderColor') || ''));
  325. setColor(K(colorBox[1]), K.toHex(table[0].style.backgroundColor || table[0].bgColor || ''));
  326. widthBox[0].focus();
  327. widthBox[0].select();
  328. }
  329. },
  330. //modify cell
  331. cellprop : function() {
  332. var html = [
  333. '<div style="padding:10px 20px;">',
  334. //width, height
  335. '<div class="ke-dialog-row">',
  336. '<label for="keWidth" style="width:90px;">' + lang.size + '</label>',
  337. lang.width + ' <input type="text" id="keWidth" class="ke-input-text ke-input-number" name="width" value="" maxlength="4" /> &nbsp; ',
  338. '<select name="widthType">',
  339. '<option value="%">' + lang.percent + '</option>',
  340. '<option value="px">' + lang.px + '</option>',
  341. '</select> &nbsp; ',
  342. lang.height + ' <input type="text" class="ke-input-text ke-input-number" name="height" value="" maxlength="4" /> &nbsp; ',
  343. '<select name="heightType">',
  344. '<option value="%">' + lang.percent + '</option>',
  345. '<option value="px">' + lang.px + '</option>',
  346. '</select>',
  347. '</div>',
  348. //align
  349. '<div class="ke-dialog-row">',
  350. '<label for="keAlign" style="width:90px;">' + lang.align + '</label>',
  351. lang.textAlign + ' <select id="keAlign" name="textAlign">',
  352. '<option value="">' + lang.alignDefault + '</option>',
  353. '<option value="left">' + lang.alignLeft + '</option>',
  354. '<option value="center">' + lang.alignCenter + '</option>',
  355. '<option value="right">' + lang.alignRight + '</option>',
  356. '</select> ',
  357. lang.verticalAlign + ' <select name="verticalAlign">',
  358. '<option value="">' + lang.alignDefault + '</option>',
  359. '<option value="top">' + lang.alignTop + '</option>',
  360. '<option value="middle">' + lang.alignMiddle + '</option>',
  361. '<option value="bottom">' + lang.alignBottom + '</option>',
  362. '<option value="baseline">' + lang.alignBaseline + '</option>',
  363. '</select>',
  364. '</div>',
  365. //border
  366. '<div class="ke-dialog-row">',
  367. '<label for="keBorder" style="width:90px;">' + lang.border + '</label>',
  368. lang.borderWidth + ' <input type="text" id="keBorder" class="ke-input-text ke-input-number" name="border" value="" maxlength="4" /> &nbsp; ',
  369. lang.borderColor + ' <span class="ke-inline-block ke-input-color"></span>',
  370. '</div>',
  371. //background color
  372. '<div class="ke-dialog-row">',
  373. '<label for="keBgColor" style="width:90px;">' + lang.backgroundColor + '</label>',
  374. '<span class="ke-inline-block ke-input-color"></span>',
  375. '</div>',
  376. '</div>'
  377. ].join('');
  378. var picker, currentElement;
  379. function removePicker() {
  380. if (picker) {
  381. picker.remove();
  382. picker = null;
  383. currentElement = null;
  384. }
  385. }
  386. var dialog = self.createDialog({
  387. name : name,
  388. width : 500,
  389. height : 220,
  390. title : self.lang('tablecell'),
  391. body : html,
  392. beforeDrag : removePicker,
  393. beforeRemove : function() {
  394. removePicker();
  395. colorBox.unbind();
  396. },
  397. yesBtn : {
  398. name : self.lang('yes'),
  399. click : function(e) {
  400. var width = widthBox.val(),
  401. height = heightBox.val(),
  402. widthType = widthTypeBox.val(),
  403. heightType = heightTypeBox.val(),
  404. padding = paddingBox.val(),
  405. spacing = spacingBox.val(),
  406. textAlign = textAlignBox.val(),
  407. verticalAlign = verticalAlignBox.val(),
  408. border = borderBox.val(),
  409. borderColor = K(colorBox[0]).html() || '',
  410. bgColor = K(colorBox[1]).html() || '';
  411. if (!/^\d*$/.test(width)) {
  412. alert(self.lang('invalidWidth'));
  413. widthBox[0].focus();
  414. return;
  415. }
  416. if (!/^\d*$/.test(height)) {
  417. alert(self.lang('invalidHeight'));
  418. heightBox[0].focus();
  419. return;
  420. }
  421. if (!/^\d*$/.test(border)) {
  422. alert(self.lang('invalidBorder'));
  423. borderBox[0].focus();
  424. return;
  425. }
  426. cell.css({
  427. width : width !== '' ? (width + widthType) : '',
  428. height : height !== '' ? (height + heightType) : '',
  429. 'background-color' : bgColor,
  430. 'text-align' : textAlign,
  431. 'vertical-align' : verticalAlign,
  432. 'border-width' : border,
  433. 'border-style' : border !== '' ? 'solid' : '',
  434. 'border-color' : borderColor
  435. });
  436. self.hideDialog().focus();
  437. self.addBookmark();
  438. }
  439. }
  440. }),
  441. div = dialog.div,
  442. widthBox = K('[name="width"]', div).val(100),
  443. heightBox = K('[name="height"]', div),
  444. widthTypeBox = K('[name="widthType"]', div),
  445. heightTypeBox = K('[name="heightType"]', div),
  446. paddingBox = K('[name="padding"]', div).val(2),
  447. spacingBox = K('[name="spacing"]', div).val(0),
  448. textAlignBox = K('[name="textAlign"]', div),
  449. verticalAlignBox = K('[name="verticalAlign"]', div),
  450. borderBox = K('[name="border"]', div).val(1),
  451. colorBox = K('.ke-input-color', div);
  452. function setColor(box, color) {
  453. color = color.toUpperCase();
  454. box.css('background-color', color);
  455. box.css('color', color === '#000000' ? '#FFFFFF' : '#000000');
  456. box.html(color);
  457. }
  458. setColor(K(colorBox[0]), '#000000');
  459. setColor(K(colorBox[1]), '');
  460. function clickHandler(e) {
  461. removePicker();
  462. if (!picker || this !== currentElement) {
  463. var box = K(this),
  464. pos = box.pos();
  465. picker = K.colorpicker({
  466. x : pos.x,
  467. y : pos.y + box.height(),
  468. z : 811214,
  469. selectedColor : K(this).html(),
  470. colors : self.colorTable,
  471. noColor : self.lang('noColor'),
  472. shadowMode : self.shadowMode,
  473. click : function(color) {
  474. setColor(box, color);
  475. removePicker();
  476. }
  477. });
  478. currentElement = this;
  479. }
  480. }
  481. colorBox.click(clickHandler);
  482. // foucs and select
  483. widthBox[0].focus();
  484. widthBox[0].select();
  485. // get selected cell
  486. var cell = self.plugin.getSelectedCell();
  487. var match,
  488. cellWidth = cell[0].style.width || cell[0].width || '',
  489. cellHeight = cell[0].style.height || cell[0].height || '';
  490. if ((match = /^(\d+)((?:px|%)*)$/.exec(cellWidth))) {
  491. widthBox.val(match[1]);
  492. widthTypeBox.val(match[2]);
  493. } else {
  494. widthBox.val('');
  495. }
  496. if ((match = /^(\d+)((?:px|%)*)$/.exec(cellHeight))) {
  497. heightBox.val(match[1]);
  498. heightTypeBox.val(match[2]);
  499. }
  500. textAlignBox.val(cell[0].style.textAlign || '');
  501. verticalAlignBox.val(cell[0].style.verticalAlign || '');
  502. var border = cell[0].style.borderWidth || '';
  503. if (border) {
  504. border = parseInt(border);
  505. }
  506. borderBox.val(border);
  507. setColor(K(colorBox[0]), K.toHex(cell[0].style.borderColor || ''));
  508. setColor(K(colorBox[1]), K.toHex(cell[0].style.backgroundColor || ''));
  509. widthBox[0].focus();
  510. widthBox[0].select();
  511. },
  512. insert : function() {
  513. this.prop(true);
  514. },
  515. 'delete' : function() {
  516. var table = self.plugin.getSelectedTable();
  517. self.cmd.range.setStartBefore(table[0]).collapse(true);
  518. self.cmd.select();
  519. table.remove();
  520. self.addBookmark();
  521. },
  522. colinsert : function(offset) {
  523. var table = self.plugin.getSelectedTable()[0],
  524. row = self.plugin.getSelectedRow()[0],
  525. cell = self.plugin.getSelectedCell()[0],
  526. index = cell.cellIndex + offset;
  527. for (var i = 0, len = table.rows.length; i < len; i++) {
  528. var newRow = table.rows[i],
  529. newCell = newRow.insertCell(index);
  530. newCell.innerHTML = K.IE ? '' : '<br />';
  531. // 调整下一行的单元格index
  532. index = _getCellIndex(table, newRow, newCell);
  533. }
  534. self.cmd.range.selectNodeContents(cell).collapse(true);
  535. self.cmd.select();
  536. self.addBookmark();
  537. },
  538. colinsertleft : function() {
  539. this.colinsert(0);
  540. },
  541. colinsertright : function() {
  542. this.colinsert(1);
  543. },
  544. rowinsert : function(offset) {
  545. var table = self.plugin.getSelectedTable()[0],
  546. row = self.plugin.getSelectedRow()[0],
  547. cell = self.plugin.getSelectedCell()[0],
  548. newRow;
  549. if (offset === 1) {
  550. newRow = table.insertRow(row.rowIndex + (cell.rowSpan - 1) + offset);
  551. } else {
  552. newRow = table.insertRow(row.rowIndex);
  553. }
  554. for (var i = 0, len = row.cells.length; i < len; i++) {
  555. var newCell = newRow.insertCell(i);
  556. // copy colspan
  557. if (offset === 1 && row.cells[i].colSpan > 1) {
  558. newCell.colSpan = row.cells[i].colSpan;
  559. }
  560. newCell.innerHTML = K.IE ? '' : '<br />';
  561. }
  562. self.cmd.range.selectNodeContents(cell).collapse(true);
  563. self.cmd.select();
  564. self.addBookmark();
  565. },
  566. rowinsertabove : function() {
  567. this.rowinsert(0);
  568. },
  569. rowinsertbelow : function() {
  570. this.rowinsert(1);
  571. },
  572. rowmerge : function() {
  573. var table = self.plugin.getSelectedTable()[0],
  574. row = self.plugin.getSelectedRow()[0],
  575. cell = self.plugin.getSelectedCell()[0],
  576. rowIndex = row.rowIndex, // 当前行的index
  577. nextRowIndex = rowIndex + cell.rowSpan, // 下一行的index
  578. nextRow = table.rows[nextRowIndex]; // 下一行
  579. // 最后一行不能合并
  580. if (table.rows.length <= nextRowIndex) {
  581. return;
  582. }
  583. var cellIndex = _getCellIndex(table, row, cell); // 下一行单元格的index
  584. if (nextRow.cells.length <= cellIndex) {
  585. return;
  586. }
  587. var nextCell = nextRow.cells[cellIndex]; // 下一行单元格
  588. // 上下行的colspan不一致时不能合并
  589. if (cell.colSpan !== nextCell.colSpan) {
  590. return;
  591. }
  592. cell.rowSpan += nextCell.rowSpan;
  593. nextRow.deleteCell(cellIndex);
  594. self.cmd.range.selectNodeContents(cell).collapse(true);
  595. self.cmd.select();
  596. self.addBookmark();
  597. },
  598. colmerge : function() {
  599. var table = self.plugin.getSelectedTable()[0],
  600. row = self.plugin.getSelectedRow()[0],
  601. cell = self.plugin.getSelectedCell()[0],
  602. rowIndex = row.rowIndex, // 当前行的index
  603. cellIndex = cell.cellIndex,
  604. nextCellIndex = cellIndex + 1;
  605. // 最后一列不能合并
  606. if (row.cells.length <= nextCellIndex) {
  607. return;
  608. }
  609. var nextCell = row.cells[nextCellIndex];
  610. // 左右列的rowspan不一致时不能合并
  611. if (cell.rowSpan !== nextCell.rowSpan) {
  612. return;
  613. }
  614. cell.colSpan += nextCell.colSpan;
  615. row.deleteCell(nextCellIndex);
  616. self.cmd.range.selectNodeContents(cell).collapse(true);
  617. self.cmd.select();
  618. self.addBookmark();
  619. },
  620. rowsplit : function() {
  621. var table = self.plugin.getSelectedTable()[0],
  622. row = self.plugin.getSelectedRow()[0],
  623. cell = self.plugin.getSelectedCell()[0],
  624. rowIndex = row.rowIndex;
  625. // 不是可分割单元格
  626. if (cell.rowSpan === 1) {
  627. return;
  628. }
  629. var cellIndex = _getCellIndex(table, row, cell);
  630. for (var i = 1, len = cell.rowSpan; i < len; i++) {
  631. var newRow = table.rows[rowIndex + i],
  632. newCell = newRow.insertCell(cellIndex);
  633. if (cell.colSpan > 1) {
  634. newCell.colSpan = cell.colSpan;
  635. }
  636. newCell.innerHTML = K.IE ? '' : '<br />';
  637. // 调整下一行的单元格index
  638. cellIndex = _getCellIndex(table, newRow, newCell);
  639. }
  640. K(cell).removeAttr('rowSpan');
  641. self.cmd.range.selectNodeContents(cell).collapse(true);
  642. self.cmd.select();
  643. self.addBookmark();
  644. },
  645. colsplit : function() {
  646. var table = self.plugin.getSelectedTable()[0],
  647. row = self.plugin.getSelectedRow()[0],
  648. cell = self.plugin.getSelectedCell()[0],
  649. cellIndex = cell.cellIndex;
  650. // 不是可分割单元格
  651. if (cell.colSpan === 1) {
  652. return;
  653. }
  654. for (var i = 1, len = cell.colSpan; i < len; i++) {
  655. var newCell = row.insertCell(cellIndex + i);
  656. if (cell.rowSpan > 1) {
  657. newCell.rowSpan = cell.rowSpan;
  658. }
  659. newCell.innerHTML = K.IE ? '' : '<br />';
  660. }
  661. K(cell).removeAttr('colSpan');
  662. self.cmd.range.selectNodeContents(cell).collapse(true);
  663. self.cmd.select();
  664. self.addBookmark();
  665. },
  666. coldelete : function() {
  667. var table = self.plugin.getSelectedTable()[0],
  668. row = self.plugin.getSelectedRow()[0],
  669. cell = self.plugin.getSelectedCell()[0],
  670. index = cell.cellIndex;
  671. for (var i = 0, len = table.rows.length; i < len; i++) {
  672. var newRow = table.rows[i],
  673. newCell = newRow.cells[index];
  674. if (newCell.colSpan > 1) {
  675. newCell.colSpan -= 1;
  676. if (newCell.colSpan === 1) {
  677. K(newCell).removeAttr('colSpan');
  678. }
  679. } else {
  680. newRow.deleteCell(index);
  681. }
  682. // 跳过不需要删除的行
  683. if (newCell.rowSpan > 1) {
  684. i += newCell.rowSpan - 1;
  685. }
  686. }
  687. if (row.cells.length === 0) {
  688. self.cmd.range.setStartBefore(table).collapse(true);
  689. self.cmd.select();
  690. K(table).remove();
  691. } else {
  692. self.cmd.selection(true);
  693. }
  694. self.addBookmark();
  695. },
  696. rowdelete : function() {
  697. var table = self.plugin.getSelectedTable()[0],
  698. row = self.plugin.getSelectedRow()[0],
  699. cell = self.plugin.getSelectedCell()[0],
  700. rowIndex = row.rowIndex;
  701. // 从下到上删除
  702. for (var i = cell.rowSpan - 1; i >= 0; i--) {
  703. table.deleteRow(rowIndex + i);
  704. }
  705. if (table.rows.length === 0) {
  706. self.cmd.range.setStartBefore(table).collapse(true);
  707. self.cmd.select();
  708. K(table).remove();
  709. } else {
  710. self.cmd.selection(true);
  711. }
  712. self.addBookmark();
  713. }
  714. };
  715. self.clickToolbar(name, self.plugin.table.prop);
  716. });