JS处理radio控件 全选、全部选、不全选(随机)
JS代码
//全选
function checkall() {
//找到所有input标签
var rad = document.getElementsByTagName("input");
for (var i = 0; i < rad.length; i++) {
var e = rad[i];
if (e.type == 'radio'&&e.value=='1') {
e.checked = true;
}
}
}
//全不选
function check() {
var rad = document.getElementsByTagName("input");
for (var i = 0; i < rad.length; i++) {
var e = rad[i];
if (e.type == 'radio'&&e.value=='1') {
e.checked = false;
}
}
}
//从一个给定的数组arr中,随机返回num个不重复项
function getArray(arr, num) {
//新建一个数组,将传入的数组复制过来,用于运算,而不要直接操作传入的数组;
var temp_array = new Array();
for (var index in arr) {
temp_array.push(arr[index]);
}
//取出的数值项,保存在此数组
var return_array = new Array();
for (var i = 0; i < num; i++) {
//判断如果数组还有可以取出的元素,以防下标越界
if (temp_array.length > 0) {
//在数组中产生一个随机索引
var arrIndex = Math.floor(Math.random() * temp_array.length);
//将此随机索引的对应的数组元素值复制出来
return_array[i] = temp_array[arrIndex];
//然后删掉此索引的数组元素,这时候temp_array变为新的数组
temp_array.splice(arrIndex, 1);
} else {
//数组中数据项取完后,退出循环,比如数组本来只有10项,但要求取出20项.
break;
}
}
return return_array;
}
//不全选
function checkof() {
//获取一个随机数,此随机数将确定选择几个radio
var a = parseInt(10 * Math.random());
var arr = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"];
var arry = getArray(arr, a);
//获取所有的input标签
var rad = document.getElementsByTagName("input");
for (var b in arry) {
for (var i = 0; i < rad.length; i++) {
var c = "Radio" + arry[b];
var e = rad[i];
if (e.type == 'radio' && e.value == '1'&&e.id==c) {
e.checked = true;
}
}
}
}
//}
HTML代码
<body>
<form >
<input id="Radio11" type="radio" name="radio" value="全选" onClick="checkall(this.form);">全选
<input id="Radio12" type="radio" name="radio" value="全不选" onClick="check(this.form)">全不选
<input id="Radio13" type="radio" name="radio" value="全不选" onClick="checkof(this.form)">不全选(随机)
<p> </p>
<input id="Radio1" type="radio" name="radio1" value="1"/>
<input id="Radio2" type="radio" name="radio2" value="1"/>
<input id="Radio3" type="radio" name="radio3" value="1"/>
<input id="Radio4" type="radio" name="radio4" value="1"/>
<input id="Radio5" type="radio" name="radio5" value="1"/>
<input id="Radio6" type="radio" name="radio6" value="1"/>
<input id="Radio7" type="radio" name="radio7" value="1"/>
<input id="Radio8" type="radio" name="radio8" value="1"/>
<input id="Radio9" type="radio" name="radio9" value="1"/>
<input id="Radio10" type="radio" name="radio0" value="1"/>
</form>
</body>