SpreadJS是面向企業級應用開發、基于HTML5的純JavaScript電子表格控件，可用不到100行代碼，在前端實現Excel的全部功能。提供移動跨平臺和瀏覽器支持，同時滿足.NET、Java、App等應用程序中的Web Excel組件開發、數據填報、在線文檔、圖表公式聯動、類Excel UI設計。

本文整理了該JavaScript電子表格控件的表單相關問題及答案，希望對你有所幫助。

點擊下載SpreadJS正式版

問：可以設置表單的行數列數嗎？

可以通過相關API來設置表單的行數、列數，默認情況表單會有200行、20列。例如：sheet.setRowCount(20, GC.Spread.Sheets.SheetArea.viewport);設置了表單行數為20行。

問：如何在新增行的時候復制上一行的樣式？

可以使用getActualStyle()獲取上一行的樣式，在使用setStyle()給新增行設置樣式，參考代碼：

sheet.addRows(intIndex,1);
      for(var i=0;i<sheet.getColumnCount();i++){
        var actualStyle = sheet.getActualStyle(intIndex-1,i);
        sheet.setStyle(intIndex,i,actualStyle);
      }

問：如何解決調用setActiveSheet方法后當前表單位置未移動的問題？

可通過獲取到sheet的index后調用startSheetIndex方法來定位。

問：如何處理報錯“將帶來重復的合并效果”？

確定一下粘貼范圍是不是已經存在合并單元格了，如果是，那么粘貼過來會有重復合并的效果。

舉個例子：有兩個合并單元格（0,0,2,2）、(2,1,2,2)。將(0,0,2,2)copyto至 2,1（toRow:2,toColumn:1）就會出現重復合并的情況，因為2,1,2,2上已經存在了一個合并單元格，該合并單元格與將要粘貼的區域存在沖突。

問：如何判斷當前選中的單元格處于可顯示區域？

用TopRowChanged和LeftColumnChanged事件進行判斷

問：點擊新增按鈕會觸發什么事件？

SheetTabClick事件中可以通過判斷來獲取 ，例如：

spread.bind(GC.Spread.Sheets.Events.SheetTabClick, function (e, info) {
        alert("Index (" + info.sheetTabIndex + ")");
});

如果是，點擊新增Sheet頁alert的結果是-1。

問：如何獲取一個單元格中的選中數據？

SpreadJS產品本身的接口是獲取不到的，HTML中可以通過window.getSelection()來獲取鼠標選中的范圍的內容，

問：（表單保護）如何設置單元格鎖定？

很多用戶對如何設置SpreadJS單元格是編輯狀態比較困惑。下面我們就詳細說明下spreadJS的表單保護機制，如何不讓單元格被編輯。

SpreadJS雖然是一款控件但是他并不是像其他控件一樣只要設置disabled等屬性就可以禁止編輯。和Excel一樣需要同時設定鎖定（locked）和保護（Protect）兩個狀態為true，才能讓單元格禁止編輯。

具體我們分三種情況詳細說明一下。

1. 所有單元格都不能編輯

這種情況比較簡單只要設置sheet.setIsProtected(true);就可以實現效果，因為sheet默認是被鎖定的，我們只需要設置保護即可。

2. Sheet中大部分單元格不可編輯只有少數行列可編輯。

這種情況就和網站示例中所展示的效果一致，綠色單元格格是可以編輯的。其余不可以編輯。

如果我們不希望單元格被編輯，只要給單元格設置一個locked為true的style即可，如果整行都不希望被編輯，使用setStyle方法時第二個參數設置為-1，那么這一行都被locked了。

3. Sheet中大部分單元格可以編輯少數不能編輯。

和上面第二種情況相反，我們可能只希望少數幾個單元格是不能編輯的，比如希望第一行作為列頭是不能編輯的。這時只要設置sheet默認loecked為false，然后將第一行鎖定即可。

var defaultStyle = new GcSpread.Sheets.Style();
defaultStyle.locked = false;
activeSheet.setDefaultStyle(defaultStyle, GcSpread.Sheets.SheetArea.viewport);
var style = new GcSpread.Sheets.Style();
style.locked = true;
style.backColor = "red";
activeSheet.setStyle(0, -1, style);
activeSheet.setIsProtected(true);

以上三種情況就是我們所能遇到的所有情況了。只要理解了表單保護的機制，設置起來是很簡單的。只要記得最后一定要setIsProtected(true)！

*想要獲得 SpreadJS 更多資源或正版授權的朋友，可以咨詢了解哦~