event.srcElement应用练习

最新推荐文章于 2025-08-11 19:52:03 发布

转载最新推荐文章于 2025-08-11 19:52:03 发布 · 76 阅读

文章标签：

#xhtml #javascript #ViewUI

本文介绍了一种使用JavaScript通过事件监听来确定HTML表格中被点击单元格位置的方法。具体实现上，利用了event.srcElement属性来捕获被点击元素，并进一步获取其所在行与列的位置信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

轉自:http://www.cnitblog.com/yemoo/archive/2006/06/21/12637.aspx
js學習:http://www.cnitblog.com/yemoo/category/3107.html
DHTML開發手冊:http://www.hbcms.com/main/dhtml/index.html

感觉这个挺好，可以捕获当前事件作用的对象，如event.srcElement.tagName可以捕获活动标记名称。
注意获取的标记都以大写表示，如"TD","TR","A"等。

偶应用event.srcElement把以前的一个代码重写了下，扩展了其功能，很简单的一段代码。

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html xmlns ="http://www.w3.org/1999/xhtml" xml:lang ="en" lang ="en" >
< head >
   < title ></ title >
   < script type ="text/javascript" >
     function tdclick(){
         if (event.srcElement.tagName.toLowerCase() == 'td')
            alert( " 行： " + (event.srcElement.parentNode.rowIndex + 1 ) + " 列： " + (event.srcElement.cellIndex + 1 ));
    }
   </ script >
</ head >
< body >
< table align ="center" onclick ="tdclick()" width ="100%" height ="400" cellspacing ="1" border ="1" bordercolor ="#000000" bordercolorlight ="#000000" bordercolordark ="#C0C0C0" bgcolor ="#C0C0C0" >
   < tr >
     < td >   </ td >
     < td >   </ td >
     < td >   </ td >
     < td >   </ td >
   </ tr >
   < tr >
     < td >   </ td >
     < td >   </ td >
     < td >   </ td >
     < td >   </ td >
   </ tr >
   < tr >
     < td >   </ td >
     < td >   </ td >
     < td >   </ td >
     < td >   </ td >
   </ tr >
</ table >
</ body >
</ html >