请教TABLE中单元格的选中效果问题，不希望在TD中使用事件。

Question

<script language="JavaScript">
<!--
var tbs = new Hashtable();
var unit_cells = new Hashtable();
var unit_objs = new Hashtable();
var n = 0;
var tbObj = t1;
Array.prototype.digitalsort=function(){this.sort(new Function("a","b","return digitalcomp(a,b,'1')"));}function coordinates(x,y,sx,sy,ex,ey)
{
this.x = x;
this.y = y;
this.sx = sx;
this.sy = sy;
this.ex = ex;
this.ey = ey;
}
//----------------------------------------------------------------------------
function cal_coordinates(){

var first_cell = tbObj.rows[0].cells[1];
var sx = fnGetPosition(first_cell,'Left');
var sy = fnGetPosition(first_cell,'Top');
var width = first_cell.offsetWidth;
var height= first_cell.offsetHeight;
var height0= 0;

tbs.put('width', width);
tbs.put('height', height);
for(var i=0; i<tbObj.rows.length; i++){
var width0 = 0; for(var j=1; j<tbObj.rows[0].cells.length; j++){
var key = i + '-' + j;
var col = new coordinates(0,0,0,0,0,0);
col.x = i;
col.y = j;
col.sx = sx + width0;
col.sy = sy + height0;
col.ex = col.sx + width;
col.ey = col.sy + height;
// ohoh.innerHTML = ohoh.innerHTML + col.x + ',' + col.y + ',' + col.sx + ',' + col.sy + ',' + col.ex + ',' + col.ey + '<br>'; width0 += width;
tbs.put(key, col);
}
height0 += height;
}
}
function cal_time()
{
   var d, s = "Time: ";
   var c = ":";
   d = new Date();
   s += d.getHours() + c;
   s += d.getMinutes() + c;
   s += d.getSeconds() + c;
   s += d.getMilliseconds();
   return(s);
}
ohoh.innerText = cal_time();
cal_coordinates();
ohoh1.innerText = cal_time();
//alert(tbs.size());//----------------------------------------------------------------------------
function selectedArea(sObj, eObj, lineColor)
{
this.sObj = sObj;
this.eObj = eObj;
this.lineColor = lineColor;

var scol = 0;
var srow = 0;
var ecol = 0;
var erow = 0;
var startObj = null; this.show = show; this.drawNet = drawNet;
this.drawRect = drawRect;
this.drawTopLine = drawTopLine;
this.drawBottomLine = drawBottomLine;
this.drawLeftLine = drawLeftLine;
this.drawRightLine = drawRightLine;
this.drawNone = drawNone; this.unitTD = unitTD; function xy(row,col){
this.row = row;
this.col = col;
}
function unitTD()
{
var delObjs = new Array();
var selObjs = new Array();
var n=0;
var m=0;
var unit_obj_name = srow+'.'+scol+'-'+erow+'.'+ecol;
//alert('srow='+ srow + ',scol=' + scol + 'erow='+ erow + ',ecol=' + ecol);
for(var i = srow; i<=erow; i++)
for(var j = scol; j<=ecol; j++) {  var key = i + '-' + j; if(unit_cells.containsKey(key)){
var value = unit_cells.get(key); 
var x_y = unit_objs.get(value);  if(x_y!=null) {
var rows = new Array();
var cols = new Array();
for(var k=0; k<x_y.length; k++){ 
rows[k] = x_y[k].row; 
cols[k] = x_y[k].col;
} rows.digitalsort();
cols.digitalsort();
delObjs[n++] = tbObj.rows[rows[0]].cells[cols[0]];
unit_objs.remove(value);
}
}else{
delObjs[n++] = tbObj.rows[i].cells[j];
}

var x_y = new xy(i,j);
//alert(x_y.row + '|' +  x_y.col);
selObjs[m++] = x_y;
//ohoh5.innerHTML = ohoh5.innerHTML + i+'-'+j + '<br>';
unit_cells.put(i+'-'+j , unit_obj_name); }
//alert(2);
unit_objs.put(unit_obj_name,selObjs);
//alert(3);
for(var i=1; i<delObjs.length; i++){  delObjs[i].removeNode(1);
}
ohoh5.innerText = 'srow=' + srow + ',scol=' + scol + '|erow=' + erow + ',ecol=' + ecol;
delObjs[0].colSpan = ecol-scol + 1;
delObjs[0].rowSpan = erow-srow + 1;
}

function show()
{
// if(this.sObj == null || this.eObj == null) return;
var n = 0;
var m = 0;
var rows = new Array();
var cols = new Array(); function cal_row_col(){
rows.digitalsort();
cols.digitalsort();
srow = rows[0];
erow = rows[rows.length-1];
scol = cols[0];
ecol = cols[cols.length-1];
}
function cal_contain_cell(key){ 
if(!unit_cells.containsKey(key)) return; 
var value = unit_cells.get(key); 
var x_y = unit_objs.get(value); 
for(var k=0; k<x_y.length; k++){ 
rows[n++] = x_y[k].row; 
cols[m++] = x_y[k].col;
}
}

Answer 1

function cal_contain(){
if(unit_cells.size()!=0){
for(var i=scol; i<=ecol; i++) {
var key1 = srow + '-' + i;
var key2 = erow + '-' + i;
cal_contain_cell(key1);
cal_contain_cell(key2);
} for(var i=srow; i<=erow; i++) {
var key1 = i + '-' + scol;
var key2 = i + '-' + ecol;
cal_contain_cell(key1);
cal_contain_cell(key2);
}
cal_row_col();
}
}
rows[n++] = this.sObj.x;
rows[n++] = this.eObj.x;
cols[m++] = this.sObj.y;
cols[m++] = this.eObj.y;
cal_row_col();
//ohoh.innerText= 'ohoh:' + srow + ',' + scol + ',' + erow + ',' + ecol; cal_contain();
cal_contain();//ohoh1.innerText= 'ohoh1:' + srow + ',' + scol + ',' + erow + ',' + ecol;
startObj = tbs.get(srow + '-' + scol);  var width = 0;
var height = 0;
for(var i=scol; i<=ecol; i++) width += tbs.get('width');
for(var i=srow; i<=erow; i++) height += tbs.get('height'); hehe.style.left = startObj.sx;
hehe.style.top = startObj.sy;
hehe.style.width = width;
hehe.style.height = height;
hehe.style.display = 'block';
}
function drawNet()//网
{
for(var i = srow; i<=erow; i++)
for(var j = scol; j<=ecol; j++){
tbObj.rows[i].cells[j].style.borderColor = 'white ' + this.lineColor + ' ' + this.lineColor + ' white';
}
this.drawTopLine();
this.drawLeftLine();
}
function drawNone()//无
{
for(var i = srow; i<=erow; i++)
for(var j = scol; j<=ecol; j++){
tbObj.rows[i].cells[j].style.borderColor = 'white #ADD8E6 #ADD8E6 white';
}
if( srow-1 > 0){
for(var j = scol; j<=ecol; j++) tbObj.rows[srow-1].cells[j].style.borderBottomColor = '#ADD8E6';
}
if( scol-1 > 0){
for(var j = srow; j<=erow; j++) tbObj.rows[j].cells[scol-1].style.borderRightColor = '#ADD8E6';
} }
function drawRect() //框
{
this.drawTopLine();
this.drawBottomLine();
this.drawLeftLine();
this.drawRightLine();
} function drawTopLine() //上边
{
if( srow-1 > 0){
for(var j = scol; j<=ecol; j++) tbObj.rows[srow-1].cells[j].style.borderBottomColor = this.lineColor;
}
}
function drawBottomLine() //下边
{
for(var i = scol; i<=ecol; i++){
tbObj.rows[erow].cells[i].style.borderBottomColor = this.lineColor;
}
}
function drawLeftLine() //左边
{
if( scol-1 > 0){
for(var j = srow; j<=erow; j++) tbObj.rows[j].cells[scol-1].style.borderRightColor = this.lineColor;
}
}
function drawRightLine() //右边
{
for(var i = srow; i<=erow; i++){
tbObj.rows[i].cells[ecol].style.borderRightColor = this.lineColor;
}
}
}var selected_area = new selectedArea(null,null,'blue');function aa()
{
a1.colSpan = 2;
a2.removeNode(1); a3.rowSpan = 2;
a7.removeNode(1);
}
function getParentNodeByTagName(node,tagName)
{
while(node.tagName != tagName) node = node.parentElement;
return node;
}
function down()
{
n=1;
getFocusObj(true);
selected_area.show();
// tbObj.setCapture();
//alert(tbs.size());
}
function up()
{
n=0;
// tbObj.releaseCapture();
}
function move()
{
if(n!=1) return;
getFocusObj(false);
selected_area.show();
}
function getFocusObj(kind){
var x = event.clientX + document.body.scrollLeft;
var y = event.clientY + document.body.scrollTop;
var key = null;
var col = null;
for(var i=0; i<tbObj.rows.length; i++)
for(var j=1; j<tbObj.rows[0].cells.length; j++){
key = i + '-' + j;
col = tbs.get(key);
if(x > col.sx & y > col.sy && x < col.ex & y < col.ey){
if(kind) selected_area.sObj = col;
selected_area.eObj = col;
break;
}//end if
}
}
function digitalcomp(x,y,flag)
{ 
if(flag!=1) return Number(y)-Number(x); 
else return Number(x)-Number(y); 
}
function fnGetPosition(obj,direction)
{
    var objPosition=0;
    while (obj !=null){
      objPosition+=obj["offset"+direction];
      obj=obj.offsetParent;
    }
    return objPosition;
}
//-->
</script></body>
</html>

Answer 2

<!--
注明：本程序可直接保存在HTML文件中浏览，应该可以解决你上面所说的前面两个问题，
至于第三个问题，你可以在现有基础上稍加修改就可以搞定，因我放假回家了，不便
调试，所以第三个问题的代码就不写了，见谅！^-^
-->
<html>
<head>
<title> New Document </title>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<body>
  <table id=tblTest cellPadding=0 border=1 cellSpacing=0 width=100% height=100>
     <tr><td>第一行1</td><td>第一行2</td><td>第一行3</td></tr>
<tr><td>第二行1</td><td>第二行2</td><td>第二行3</td></tr>
<tr><td>第三行1</td><td>第三行2</td><td>第三行3</td></tr>
  </table>
</body>
</html><script language=javascript>
   tblTest.onclick=selectRow;//设置点击Table时选中一行   function selectRow(){
     var src=event.srcElement.parentElement;
     if(src.tagName=="TR"){
      alert(src.tagName);
restoreTableColor();
src.style.color="#ffffff";
src.bgColor="#000000";
     }
   }
   
   function restoreTableColor(){//恢复Table的原始颜色
var row=tblTest.rows.length;
var col=tblTest.cols.length;
for(var i=0;i<row;i++){
    tblTest.rows(i).bgColor="#ffffff";
    tblTest.rows(i).style.color="#000000";
}
   }
</script>