单元格编辑1

<!DOCTYPE html>

<head>

<title>SpreadJS Demo : 单元格编辑</title>

<style>

body {

background: rgb(250, 250, 250);

color: #333;

}

#ss {

border: 1px #ccc solid;

}

.container {

width: 80%;

background: rgb(250, 250, 250);

margin: 0 auto;

height: 600px;

}

.full-height {

height: 100%;

}

.left{

height: 100%;

overflow: auto;

}

</style>

</head>

<body>

<h3>SpreadJS Demo : 单元格编辑</h3>

</div>

<h5>

<li class="inline-block mr1"><a class="btn" href="https://www.grapecity.com.cn/developer/spreadjs "

target="_blank ">产品官网</a></li>

<li class="inline-block mr1"><a class="" href="https://gcdn.grapecity.com.cn/showforum-185-1.html "

target="_blank ">论坛求助</a></li>

<li class="inline-block mr1"><a class="" href="https://demo.grapecity.com.cn/SpreadJS/TutorialSample/#/samples "

target="_blank ">更多示例</a></li>

</ul>

</h5>

</div>

<h4 class="mb0">单元格导航行为</h4>

<p style="width: 90%"class="m0 ">说明：按Tab和Shift+Tab,

</p>

</div>

</div>

<div >

<label>按下Tab用于:</label><br/>

<option value="0" selected="selected">下一个单元格</option>

<option value="1">下一个控件 </option>

<option value="2">先单元格再控件</option>

</select>

</div>

<div >

<label>按下Shift + Tab 用于:</label><br/>

<option value="0" selected="selected">前一个单元格</option>

<option value="1">前一个控件</option>

<option value="2">前一个单元格然后控件</option>

</select>

</div>

<p style="width: 90%"class="m0 ">说明：获得变更的数据。

</p>

</div>

<h4 class="mb0">单引号前缀</h4>

<p style="width: 90%"class="m0 ">说明：当你输入的值带有单引号前缀'，输入的值会被转换并存储为字符串。

</p>

</div>

</div>

</body>

var spreadNS = GC.Spread.Sheets;

$(document).ready(function () {

var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));

var sheet = spread.getActiveSheet();

/*-------------------导航行为-----------------*/

sheet.setRowCount(10);

sheet.setColumnCount(5);

document.getElementById('tabAction').addEventListener('click',moveHandle);

document.getElementById('shiftTabAction').addEventListener('click',moveHandle);

function moveHandle(){

var id = this.id, isShift = id.indexOf("shift") === 0,

value = parseInt(this.value, 10),

actions = GC.Spread.Sheets.Commands,

action;

switch (value) {

case 0:

action = isShift ? actions.moveToPreviousCell : actions.moveToNextCell;

break;

case 1:

action = isShift ? actions.selectPreviousControl : actions.selectNextControl;

break;

case 2:

action = isShift ? actions.moveToPreviousCellThenControl : actions.moveToNextCellThenControl;

break;

}

if (action) {

// name: 操作的名称。

// execute: 操作的执行命令。

// key: 按键的 Unicode 编码。

// ctrl: 按下 Ctrl 键时为 true,否则为 false。

// shift: 按下 Shift 键时为 true，否则为 false。

// alt: 按下 Alt 键时为 true，否则为 false。

// meta: 按下 Macintosh 设备上的 Command 键或者 Windows 设备上的 Windows 键时为 true,否则为false。

spread.commandManager().register("customCommand"+ new Date().valueOf(), action, GC.Spread.Commands.Key.tab, false, isShift, false, false);

}

/*---------------------脏数据----------------------*/

function getDirtyCellData(dirtyItem){

return ["Cell (", dirtyItem.row, ",", dirtyItem.col, ") 旧值: ", dirtyItem.oldValue, " 新值: ", dirtyItem.newValue].join("");

}

function appendResult(txt) {

document.getElementById('taResult').value=document.getElementById('taResult').value + txt + "\n";

}

// 删除行

document.getElementById("btnDeleteRow").addEventListener('click',function(){

var sels = sheet.getSelections();

var len = sels.length;

if(len >0){

var s = sels[0];

sheet.deleteRows(s.row, s.rowCount);

}

});

// 增加行

document.getElementById("btnInsertRow").addEventListener('click',function(){

var sels = sheet.getSelections();

var len = sels.length;

if(len >0){

var s = sels[0];

sheet.addRows(s.row, 1);

}

});

// 获取选中区域中的单元格脏数据

document.getElementById("btnGetSelectionDirtyCells").addEventListener('click',function(){

var sels = sheet.getSelections();

var len = sels.length;

if (len > 0) {

var s = sels[0];

var row = s.row, col = s.col;

if (row < 0) {

row = 0;

}

if (col < 0) {

col = 0;

}

var cells = sheet.getDirtyCells(row, col, s.rowCount, s.colCount);

if (cells.length > 0) {

appendResult("单元格脏数据:\n" + cells.map(function (item) { return getDirtyCellData(item); }).join("\n"));

}

});

// 获取单元格脏数据

document.getElementById("btnGetDirtyCells").addEventListener('click',function(){

var cells = sheet.getDirtyCells();

if (cells.length > 0) {

appendResult("单元格脏数据:\n" + cells.map(function (item) { return getDirtyCellData(item); }).join("\n"));

}

});

// 获取整行脏数据

document.getElementById("btnGetDirtyRows").addEventListener('click',function(){

var rows = sheet.getDirtyRows();

if (rows.length > 0) {

appendResult("脏数据行:\n" + rows.map(function (item) { return item.row; }).join(", "));

}

});

// 清除改变

document.getElementById("btnClearPendingChanges").addEventListener('click',function(){

sheet.clearPendingChanges();

});

// 获取插入的行

document.getElementById("btnGetInsertRows").addEventListener('click',function(){

var rows = sheet.getInsertRows();

if (rows.length > 0) {

appendResult("插入的行 @ " + rows.map(function (item) { return item.row; }).join(", "));

}

});

// 获取删除的行

document.getElementById("btnGetDeleteRows").addEventListener('click',function(){

var rows = sheet.getDeletedRows();

if (rows.length > 0) {

appendResult("删除的行 @ " + rows.map(function (item) { return item.row; }).join(", "));

}

});

/*-------------------------------单引号前缀---------------------*/

sheet.setValue(0,0,"往单元格里输入：0123 识别为数字");

sheet.setValue(1,0,"往单元格里输入：'0123 识别为字符串");

});

</script>

</html>

单元格编辑1

推荐阅读更多精彩内容