让GridView中CheckBox列支持FireFox

<script>function StorePage(){d=document;t=d.selection?(d.selection.type!='None'?d.selection.createRange().text:''):(d.getSelection?d.getSelection():'');void(keyit=window.open('http://www.365key.com/storeit.aspx?t='+escape(d.title)+'&u='+escape(d.location.href)+'&c='+escape(t),'keyit','scrollbars=no,width=475,height=575,left=75,top=20,status=no,resizable=yes'));keyit.focus();}</script>

在Asp.net中,可以通过模板列,在Gridview中实现CheckBox列的实现,相关的代码并不复杂,你可以参考这里,我抽取的部分代码如下:

script language="javascript" type="text/javascript"> function selectAll(obj)
{
var theTable = obj.parentElement.parentElement.parentElement;
var i;
var j = obj.parentElement.cellIndex;
for(i=0;itheTable.rows.length;i++)
{
var objCheckBox = theTable.rows[i].cells[j].firstChild;
if(objCheckBox.checked!=null)objCheckBox.checked =
script>


asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False"
DataKeyNames
="id" DataSourceID="AccessDataSource1" AllowSorting="True" OnDataBinding="GridView1_DataBinding" OnRowDataBound="GridView1_RowDataBound">
Columns>
asp:TemplateField>
ItemTemplate>
asp:CheckBox ID="CheckBox1" runat="server" Checked="True" Text='%>' />
ItemTemplate>
HeaderTemplate>
input id="CheckAll" type="checkbox" onclick="selectAll(this);"/>全选 HeaderTemplate>
asp:BoundField DataField="id" HeaderText="id" InsertVisible="False" ReadOnly="True" SortExpression="id"/>
asp:BoundField DataField="name" HeaderText="name" SortExpression="name"/>
asp:BoundField DataField="sex" HeaderText="sex" SortExpression="sex"/>
asp:BoundField DataField="deptid" HeaderText="deptid" SortExpression="deptid"/>
Columns>
asp:GridView>

js代码中的selectAll(obj)方法在IE中可以正常使用。昨天,一朋友做测试,发现在FireFox中不支持,让我帮着找找原因,估计是js的代码有不兼容Firefox的,查有关资料,原来在firefox不支持parentElement,但支持parentNode,于是把原来的js代码修改了一下,通过obj.parentNode.parentNode.parentNode 来获取表格对象(GridView编译后形成的表格),不过要找到CheckBox对象要麻烦点,因为没法通过obj.parentElement.cellIndex 来定位找到ChecKbox所在位置了,只能通过循环某一行的单元格来查找了。具体的代码如下:

function select_all(obj)

{

var theTable = obj.parentNode.parentNode.parentNode;

var j = obj.parentNode.cellIndex;

for ( var i = 0 ; i theTable.rows.length; i++)

{

var objCheckBox = GetCheckBoxObj(theTable.rows[i].cells[j]);

if(objCheckBox.checked !=null)

objCheckBox.checked

= obj.checked;

}

}

function GetCheckBoxObj(objCell)

{

for(var i=0; i objCell.childNodes.length; i++)

{

if(objCell.childNodes[i].id)

{

return objCell.childNodes[i];

}

}

}

如此修改后,这个checkbox就可以兼容IE和FireFox了。

看来要是在web开发来要想兼容IE和Firefox,这个工作还是蛮艰巨的。有关firefox与ie 的javascript区别 的你看看这里,总结非常详细。不但是js,css也有很多不一样的地方。嘿嘿,由此我有点怀念IE一统天下的年代了,不过我觉得一般企业级的应用还是不专门考虑FireFox了,除非做门户网站。

本文首发地址:http://www.watch-life.net/aspnet/gridview-checkbox-firefox.html
更多文章见:守望轩[http://www.watch-life.net/]

你可能感兴趣的:(JavaScript,IE,asp.net,asp,firefox)