top:none;border-left:none;border-right:none;border-bottom:1px dashed black;background-color:transparent;font-weight: bold; color: black;" '' +
'' onkeydown="return onTextBoxKeydown();" '' +
'' onchange="return onTextBoxChange();" ></INPUT>'';
var textBox = this.children[0]; // 取得对象
textBox.width = this.offsetWidth; // 设置宽度
textBox.align = ''right''; // 对齐方式,不起作用
textBox.setActive();
textBox.focus();
this.style.backgroundColor = ''#CCCCFF''; // 设置显眼的背景,表示处于激活状态
}
}
// 单元格的去激活事件
// 当单元格被激活,编辑框出现,单元格就会失去激活,此事件就会激发
function onCellDeactivate ()
{
var parentTbl = this.parentElement.parentElement; // 获取Table
if ( parentTbl.activeCell != this ) // 如果被激活单元格不是当前单元格?
{
this.innerHTML = this.dataField.length > 0 ? this.value2 : '' ''; // 恢复显示内容
}
}当然,HTML不像窗口程序,可以在设计时就挂接事件,因此,我们需要在页面加载完成后就为除行列标头之外的单元格挂接事件,进行初始化,同时可以进行还有跨行的单元格合并:
view plaincopy to clipboardprint?
document.onreadystatechange = function() // 在页面加载完成后,初始化TABLE
{
if ( this.readyState == ''complete'' )
{
initTable(); // 初始化
}
}
function initTable()
{
for(var idx in document.worksheet ) // 遍历所有表
{
var tbl = $get(document.worksheet[idx].table); // 获取TABLE对象
for( var i = tbl.cells.length - 1; i > 1; i-- ) // 从后往前遍历所有单元格
{
var ctrl = tbl.cells[i]; // 单元格对象
if ( ctrl.cellIndex > 0 && ctrl.parentElement.rowIndex > 0) // 第一行和第一列不处理
{
ctrl.onactivate = onCellActivate; // 单元格的在激活事件
ctrl.ondeactivate = onCellDeactivate; // 单元格的去激活事件
if ( ctrl._rowspan && ctrl._rowspan > 1 && ctrl.parentElement.rowIndex + 1 < tbl.rows.length ) // 如果需要合并单元格,则合并之
{
for( var n = 1; n < ctrl._rowspan; n++ ) // 合并
{
if ( ctrl.cellIndex < tbl.rows[ctrl.parentElement.rowIndex + 1].cells.length )
tbl.rows[ctrl.parentElement.rowIndex + 1].deleteCell(ctrl.cellIndex);
}
ctrl.rowSpan = ctrl._rowspan; // 设置跨度
}
}
}
}
}
document.onreadystatechange = function() // 在页面加载完成后,初始化TABLE
{
if ( this.readyState == ''complete'' )
{
initTable(); // 初始化
}
}
function initTable()
{
for(var idx in document.worksheet ) // 遍历所有表
{
var tbl = $get(document.worksheet[idx].table); // 获取TABLE对象
for( var i = tbl.cells.length - 1; i > 1; i-- ) // 从后往前遍历所有单元格
{
var ctrl = tbl.cells[i]; // 单元格对象
if ( ctrl.cellIndex > 0 && ctrl.parentElement.rowIndex > 0) // 第一行和第一列不处理
{
ctrl.onactivate = onCellActivate; // 单元格的在激活事件
ctrl.ondeactivate = onCellDeactivate; // 单元格的去激活事件
if ( ctrl._rowspan && ctrl._rowspan > 1 && ctrl.parentElement.rowIndex + 1 < tbl.rows.length ) // 如果需要合并单元格,则合并之
{
for( var n = 1; n < ctrl._rowspan; n++ ) // 合并
{
if ( ctrl.cellIndex < tbl.rows[ctrl.parentElement.rowIndex + 1].cells.le