作家
登录

HTML-CSS群中单选引发的“事件”

作者: 来源:www.28hudong.com 2013-03-30 03:41:25 阅读 我要评论

因为死神的一个单选按钮问题,N多人出来扯淡,唉,偶这个菜鸟级人物也出来,混水摸鱼去。一个不小心也摸到了一条。 首先看从baidu中挖出来的一段代码,偶就从这里动手的。 复制代码 代码如下:<script> function checkradio() { for(i=0;i<document.form1.Fruit.length;i++) { if(document.form1.Fruit[i].checked) { alert("您最喜欢的水果是:"+document.form1.Fruit[i].nextSibling.nodeValue); } } } </script> <form name="form1"> 您最喜欢的水果是:<br> <input type=radio value="Fruit1" name="Fruit" checked>苹果 <input type=radio value="Fruit2" name="Fruit">香蕉 <input type=radio value="Fruit3" name="Fruit">草莓 <input type=radio value="Fruit4" name="Fruit">凤梨 <input type=button value="选择" onclick="checkradio()"> </form> 这段代码的作用是判断所选的值。 现在要的效果是如果每个选项都为空的时候要给出一个提示,下面的代码就是偶改动后的效果 程序代码 <script> function checkradio() { var j=0; for(i=0;i<document.form1.Fruit.length;i++) { if(document.form1.Fruit[i].checked==true) { alert("你选择了"+document.form1.Fruit[i].nextSibling.nodeValue); //break;这个break经飞飞指点,无效,去掉 }else{ j=j+1; if(j==4){ alert("靠,你TMD选一个,偶就不用出来了噶!"); } } } } </script> <form name="form1"> 您最喜欢的水果是:<br> <input type=radio value="Fruit1" name="Fruit"> 苹果 <input type=radio value="Fruit2" name="Fruit">香蕉 <input type=radio value="Fruit3" name="Fruit">草莓 <input type=radio value="Fruit4" name="Fruit">凤梨 <input type=button value="选择" onclick="checkradio()"> </form> 后来又看到了一个由晨写的更清晰的一段代码,在这里也帖一下。 (注:为了便于测试,改动了一下,思路还是他的思路) 复制代码 代码如下:<script> function checkradio() { var flag=false; for(var i=0;i<=document.form1.Fruit.length-1;i++) { if(form1.Fruit[i].checked){ flag=true;} } if(flag) { alert("^_^"); return false; }else{ alert("大侠,您老就选一个吧!"); } } </script> 单选的结束了,飞飞老大不死心,在晚上的时候搞出了一个针对复选框的代码。 复制代码 代码如下:<script> var j=document.getElementsByName("Fruit"); function allche(){ for(var i=0; i <j.length; i++){ if(document.form1.Fruit[i].checked!=true) document.form1.Fruit[i].checked= document.form1.suoy.checked; if(document.form1.Fruit[i].checked==true) document.form1.Fruit[i].checked= document.form1.suoy.checked; } } function checkall(){ var aa=0 for(var i=0; i <j.length; i++){ if(document.form1.Fruit[i].checked == true) aa++; aa!=j.length ? document.form1.suoy.checked=false : document.form1.suoy.checked=true; } } function checkradio(){ var a=0 var list="" for(var i=0; i<j.length;i++) if (document.form1.Fruit[i].checked== true){ list=="" ? list=document.form1.Fruit[i].value : list=list+","+document.form1.Fruit[i].value; } if (list!="") alert("你喜欢的水果是"+list); else{ a++; if (a==j.length)alert("大哥。你都不选我怎么知道你喜欢什么?");} } </script> <form name="form1" id="frm"> 您最喜欢的水果是:<br> <input type=checkbox value="苹果" name="Fruit" onClick="checkall()"> 苹果 <input type=checkbox value="香蕉" name="Fruit" onClick="checkall()"> 香蕉 <input type=checkbox value="草莓" name="Fruit" onClick="checkall()"> 草莓 <input type=checkbox value="凤梨" name="Fruit" onClick="checkall()"> 凤梨 <input type=button value="选择" onclick="checkradio()"> <input type=checkbox onclick="allche()" name="suoy">全选 </form> <script language="javascript" type="text/javascript" id="commonjs"> function test() { fruitlist = ""; for(i=0;i<document.getElementById("frm").length;i++) if(document.getElementById("frm")[i].type=="checkbox" && document.getElementById("frm")[i].checked) fruitlist += document.getElementById("frm")[i].value + " "; if(fruitlist!="") alert("你喜欢的水果是 "+fruitlist); else alert("大哥。你都不选我怎么知道你喜欢什么?"); } </script> 再来一段更简洁的代码、效果更好的关于复选的代码。 复制代码 代码如下:<SCRIPT LANGUAGE="JavaScript"> <!-- Begin function checkAll() { for (var j = 1; j <= 9; j++) { box = eval("document.checkboxform.C" + j); if (box.checked == false) box.checked = true; } } function uncheckAll() { for (var j = 1; j <= 9; j++) { box = eval("document.checkboxform.C" + j); if (box.checked == true) box.checked = false; } } function switchAll() { for (var j = 1; j <= 9; j++) { box = eval("document.checkboxform.C" + j); box.checked = !box.checked; } } // End --> </script> </head> <body> <form name=checkboxform> <input type=checkbox name=C1>C1<br> <input type=checkbox name=C2>C2<br> <input type=checkbox name=C3>C3<br> <input type=checkbox name=C4>C4<br> <input type=checkbox name=C5>C5<br> <input type=checkbox name=C6>C6<br> <input type=checkbox name=C7>C7<br> <input type=checkbox name=C8>C8<br> <input type=checkbox name=C9>C9<br> <br> <input type=button value="全选" onClick="checkAll()"><br> <input type=button value="取消" onClick="uncheckAll()"><br> <input type=button value="反选" onClick="switchAll()"><br> </form>

  推荐阅读

  JavaScript实现Sleep函数的代码

复制代码 代码如下:function Sleep(obj,iMinSecond) { if (window.eventList==null) window.eventList=new Array(); var ind=-1; for (var i=0;i<window.eventList.length;i++) { if (window.e>>>详细阅读


本文标题:HTML-CSS群中单选引发的“事件”

地址:http://www.17bianji.com/kaifa2/JS/30861.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)