checkbox全选问题,解决立马给分,在线等~~~~~~~~~

xiyiren 2004-10-29 09:00:08

FORM表单里有两段需要作全选,请问怎么实现?
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>

<body>
<form name="form1">
<p><input type="checkbox" name="checkbox" value="checkbox"> 全选一</p>
<p>图书一<input type="checkbox" name="checkbox" value="checkbox"></p>
<p>图书二 <input type="checkbox" name="checkbox" value="checkbox"></p>
<p>图书三 <input type="checkbox" name="checkbox" value="checkbox"></p>
<p>-------------</p>
<p>
<input type="checkbox" name="checkbox" value="checkbox">全选二</p>
<p>磁带一 <input type="checkbox" name="checkbox" value="checkbox"></p>
<p>磁场二 <input type="checkbox" name="checkbox" value="checkbox"></p>
<p>磁带三 <input type="checkbox" name="checkbox" value="checkbox"></p>
<p> </p>
<input type="submit" value="submit">
</form>
</body>
</html>

...全文

293 4 打赏收藏转发到动态举报

写回复

用AI写文章

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

xiyiren 2004-10-29

打赏
举报

谢谢三位兄弟的解答,孤独兄的实现比较好~~

guoweidong 2004-10-29

打赏
举报

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
<form name="form1">
<p><input type="checkbox" name="checkbox" id="checkbox0" value="checkbox" onclick="fullcheck();"> 全选一</p>
<p>图书一<input type="checkbox" name="checkbox" id="check0" value="checkbox"></p>
<p>图书二 <input type="checkbox" name="checkbox" id="check0" value="checkbox"></p>
<p>图书三 <input type="checkbox" name="checkbox" id="check0" value="checkbox"></p>
<p>-------------</p>
<p>
<input type="checkbox" name="checkbox" id="checkbox1" value="checkbox" onclick="fullcheckbox(this);">全选二</p>
<p>磁带一 <input type="checkbox" name="checkbox" id="check1" value="checkbox"></p>
<p>磁场二 <input type="checkbox" name="checkbox" id="check1" value="checkbox"></p>
<p>磁带三 <input type="checkbox" name="checkbox" id="check1" value="checkbox" ></p>
<p> </p>
<input type="submit" value="submit">
</form>
</body>
<script>
function fullcheckbox(checkbox)
{
if(document.all.checkbox1.checked==true)
{
for(i=0;i<document.all.check1.length;i++)
{
document.all.check1[i].checked=true;
}
}
else
{
for(i=0;i<document.all.check1.length;i++)
{
document.all.check1[i].checked=false;
}
}
}
function fullcheck(checkbox)
{
if(document.all.checkbox0.checked==true)
{
for(i=0;i<document.all.check0.length;i++)
{
document.all.check0[i].checked=true;
}
}
else
{
for(i=0;i<document.all.check0.length;i++)
{
document.all.check0[i].checked=false;
}
}
}
</script>
</html>

zhuqm 2004-10-29

打赏
举报

全选一的名字取名为chkone,属于它的复选框名字为chkone_child
全选一的名字取名为chktwo,属于它的复选框名字为chktwo_child
在它们加上事件onclick=f(this)
<script>
function f(obj){
var o=obj.form.elements;
for(var i=0;i<o.length;i++){
if(o[i].type=='checkbox'&&o[i].name==(obj.name+'_child')){
o[i].checked=obj.checked;
}
}
}
</script>
利用合理的命名可以解决很多问题！

mind_1220 2004-10-29

打赏
举报

<form name=meizz>
<input type=checkbox name=All onclick="checkAll('mm')">ȫѡ<br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/><br/>

<input type=checkbox name=All2 onclick="checkAll('mm2')">ȫѡ<br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>
<input type=checkbox name=mm2 onclick="checkItem('All2')"><br/>

</form>

<SCRIPT LANGUAGE="JavaScript">
function checkAll(str)
{
var a = document.getElementsByName(str);
var n = a.length;
for (var i=0; i<n; i++)
a[i].checked = window.event.srcElement.checked;
}
function checkItem(str)
{
var e = window.event.srcElement;
var all = eval("document.meizz."+ str);
if (e.checked)
{
var a = document.getElementsByName(e.name);
all.checked = true;
for (var i=0; i<a.length; i++)
{
if (!a[i].checked){ all.checked = false; break;}
}
}
else all.checked = false;
}
</SCRIPT>

Form组件封装：集成 Select、DatePicker、Checkbox等相关表单控件；Table组件封装；封装的组件在项目中的应用演示。改变传统的UI数据传递方式，通过属性配置的方式对组件数据进行渲染基于Vue3+ElementPlus+Vite...

小颖当时看他给的截图，也没太明白，后来手动巧了一下，发现一个疑问，虽然问题是解决了，但是至于为什么小颖还是不太明白，希望有哪位vue大神看到了能帮忙解答一下，嘻嘻，小颖先在这里提前说声：谢谢...