这种效果是可以做出来的,
一种是直接用输出的函数来控制,但这个比较麻烦,其实单单要这种效果,可以如下做法。
做一个表格,如3行5列,然后再每个单表格中加入一个text框,调节使其大小和单表格的大小一样,这样得加15个,然后用样式表控制使得text框的边框为0,底色为0,这样就可以了。运行起来就只能看见表格,而且每个表格都是可以输入的。
一种是直接用输出的函数来控制,但这个比较麻烦,其实单单要这种效果,可以如下做法。
做一个表格,如3行5列,然后再每个单表格中加入一个text框,调节使其大小和单表格的大小一样,这样得加15个,然后用样式表控制使得text框的边框为0,底色为0,这样就可以了。运行起来就只能看见表格,而且每个表格都是可以输入的。
<HEAD>
<SCRIPT>
function editCell (cell) {
if (document.all) {
cell.innerHTML =
'<INPUT ' +
' ID="editCell"' +
' ONCLICK="event.cancelBubble = true;"' +
' ONCHANGE="setCell(this.parentElement, this.value)" ' +
' ONBLUR="setCell(this.parentElement, this.value)" ' +
' VALUE="' + cell.innerText + '"' +
' SIZE="' + cell.innerText.length + '"' +
'>';
document.all.editCell.focus();
document.all.editCell.select();
}
else if (document.getElementById) {
cell.normalize();
var input = document.createElement('INPUT');
input.setAttribute('value', cell.firstChild.nodeValue);
input.setAttribute('size', cell.firstChild.nodeValue.length);
input.onchange = function (evt) { setCell(this.parentNode,
this.value); };
input.onclick = function (evt) {
evt.cancelBubble = true;
if (evt.stopPropagation)
evt.stopPropagation();
};
cell.replaceChild(input, cell.firstChild);
input.focus();
input.select();
}}
function setCell (cell, value) {
if (document.all)
cell.innerText = value;
else if (document.getElementById)
cell.replaceChild(document.createTextNode(value), cell.firstChild);
}
</SCRIPT>
</HEAD>
<BODY>
<TABLE BORDER="1">
<TR>
<TD ONCLICK="editCell(this);">
测试测试测试测试测试测试
</TD>
<TD ONCLICK="editCell(this);">
测试测试测试测试测试测试
</TD>
<TD ONCLICK="editCell(this)">
测试测试测试测试测试测试
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
<div ID="mxh" contentEditable="true">欢迎光临【孟宪会之精彩世界】。您可以在这里编辑文字!</div>
http://www.fcsoft.com.cn:8080/index.htm
那个webgrid.htc应该比JCL强吧
可以直接用鼠标拖动修改列宽
不过那堆JavaScript代码让人看着眼晕:)