实例名称

JS代码实现单击任意单元格都能自动选中复选框

实例描述

为了方便用户操作，当用户要选中复选框时，不需要单击复选框控件，而只要双击选框控件所在行中任意单元格即可。本例学习如何实现这种效果。

实例代码

html xmlns="" headtitle标题页-学无忧 language="javascript" type="text/javascript" function chkSelectvar tr = ; //获取当前操作对象的父级对象=true; //选中父对象的第一个元素-即复选框/scripttable width="285" border="1" tr ondblclick='chkSelect;' tdinput type="checkbox" name="checkbox" value="checkbox" /td td第一行第一列/td td第一行第二列/td /tr tr ondblclick='chkSelect;' tdinput type="checkbox" name="checkbox2" value="checkbox"/td td第二行第一列/td td第二行第二列/td /tr/table/body/html

运行效果

难点剖析

注意本例的双击事件是绑定在表格的行上．当用户双击某行时，首先通过“event．srcElement”属性获取双击的单元格．然后使用DOM对象的“parentElement”属性获取单元格的父级对象“tr”。因为复选框控件位于行的第一列位置，所以可以使用“children0”获取行中的复选框，最后设置其“checked”属性即可。

源码下载