源码网,源码论坛,源码之家,商业源码,游戏源码下载,discuz插件,棋牌源码下载,精品源码论坛

 找回密码
 立即注册
楼主: ttx9n

[JavaScript] checkbox全选所涉及到的知识点介绍

[复制链接]

7万

主题

861

回帖

32万

积分

论坛元老

Rank: 8Rank: 8

积分
329525
发表于 2013-12-31 15:50:51 | 显示全部楼层 |阅读模式
checkbox全选涉及到的知识点比如IE里起作用,火狐不起作用,getElementById()与getElementsByName()的区别等等 1、IE里起作用,火狐不起作用

IE版本
复制代码 代码如下:
<script type="text/javascript">

function checkALL(str)//全选控制的JS
{
var a=document.getElementsByName(str);
var n=a.length;

for(var i=0;i<n;i++)

{

a[i].checked=window.event.srcElement.checked;

}

}

</script>

火狐版本
复制代码 代码如下:
<script type="text/javascript">

function checkALL(str)//全选控制的JS
{
var a=document.getElementsByName(str);
var n=a.length;
for(var i=0;i<n;i++){
a[i].checked=document.getElementById("all").checked;
}
}

</script>

原因分析:window.event只能在IE下运行,所以在火狐下js运行不起作用。火狐版本里头,是直接获得"id=all"的checkbox被选择状态,然后赋值给"name=str"的checkbox组的每一项,这样就可以保持选择状态的同步。

2、document.getElementById()与document.getElementsByName()的区别

上面那段js通过两种方式获得了checkbox的状态,从名字上看,他们的作用应该是类似,一个通过id获得元素,一个通过name获得元素。但这两个方法是有差别的,如果在使用过程中不注意,很可能会觉得可以混用,从而会造成困扰。我当时就觉得随便用一个就好,但改名字后,js代码却不起作用,其实是因为不了解,导致用错了。

(1)document.getElementById()是通过id访问某一个特定元素,因为在一个页面中id是唯一的,所以这个函数返回的是一个Element

(2)document.getElementsByName()是通过name来访问元素,因为在一个页面中name不是唯一的,可以重名,所以这个函数返回的是一组Elements

正是因为一个是元素,一个是数组,所以在混用的时候不注意就会出错,导致js运行不下去。比如,当时我把a[i].checked=document.getElementById("all").checked;改成a[i].checked=document.getElementsByName("all").checked;的时候,js运行不起作用(因为js出错但不报错,所以感觉是没起作用),其实此处并不是不识别,是因为调用的时候用错了,正确写法是a[i].checked=document.getElementsByName("all")[0].checked;这样改后,效果一样。因为我们的页面中只存在一个"name=all"的checkbox,所以我们以[0]来取Elements中的第一个元素,就是我们通过a[i].checked=document.getElementById("all").checked;获得的那个元素。
回复

使用道具 举报

11

主题

2万

回帖

300

积分

中级会员

Rank: 3Rank: 3

积分
300
发表于 2022-8-18 12:20:21 | 显示全部楼层
66666666666666666666
回复 支持 反对

使用道具 举报

0

主题

2万

回帖

66

积分

注册会员

Rank: 2

积分
66
发表于 2022-9-3 09:20:48 | 显示全部楼层
谢谢下载来看看
回复 支持 反对

使用道具 举报

0

主题

1万

回帖

0

积分

中级会员

Rank: 3Rank: 3

积分
0
发表于 2022-11-4 01:43:34 | 显示全部楼层
554411515451555
回复 支持 反对

使用道具 举报

0

主题

2万

回帖

61

积分

注册会员

Rank: 2

积分
61
发表于 2022-12-6 04:07:57 | 显示全部楼层
还有人在不。。。。。。。。。。啊
回复 支持 反对

使用道具 举报

27

主题

2万

回帖

331

积分

中级会员

Rank: 3Rank: 3

积分
331
发表于 2023-5-10 13:41:38 | 显示全部楼层
数据库了多久撒快乐的健身卡啦
回复 支持 反对

使用道具 举报

3

主题

2万

回帖

301

积分

中级会员

Rank: 3Rank: 3

积分
301
发表于 2023-9-10 09:31:11 | 显示全部楼层
女生看了弄丢了卡萨诺的卡洛斯
回复 支持 反对

使用道具 举报

0

主题

2万

回帖

0

积分

中级会员

Rank: 3Rank: 3

积分
0
发表于 2024-3-11 18:07:37 | 显示全部楼层
看看看看
回复 支持 反对

使用道具 举报

1

主题

2万

回帖

307

积分

中级会员

Rank: 3Rank: 3

积分
307
发表于 2024-4-19 01:47:16 | 显示全部楼层
我要金豆金豆金豆
回复 支持 反对

使用道具 举报

0

主题

2万

回帖

0

积分

中级会员

Rank: 3Rank: 3

积分
0
发表于 2024-6-22 20:33:04 | 显示全部楼层
不错的源码论坛
回复 支持 反对

使用道具 举报

高级模式
B Color Image Link Quote Code Smilies

本版积分规则

手机版|小黑屋|网站地图|源码论坛 ( 海外版 )

GMT+8, 2025-2-9 12:17 , Processed in 0.069472 second(s), 22 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表