当前位置: 首页 > 图文教程 > 网络编程 > Javascript > HTML-CSS群中单选引发的“事件”

Javascript
form中限制文本字节数js代码
use jscript with List Proxy Server Information
use jscript List Installed Software
List Installed Software Features
List Information About the Binary Files Used by an Application
List the Codec Files on a Computer
List the UTC Time on a Computer
List Installed Hot Fixes
excel操作之Add Data to a Spreadsheet Cell
Add Formatted Data to a Spreadsheet
Apply an AutoFormat to an Excel Spreadsheet
JavaScript语法着色引擎（demo及打包文件下载）
类之Prototype.js学习
一款JavaScript压缩工具：X2JSCompactor
iis6+javascript Add an Extension File
jscript之Open an Excel Spreadsheet
jscript之Read an Excel Spreadsheet
jscript之List Excel Color Values
去除图像或链接黑眼圈的两种方法总结
Add a Formatted Table to a Word Document

No. « 70 71 72 73 »

技术文章搜索

关键字

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

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-09-12   浏览: 130 ::
收藏到网摘: n/a

因为死神的一个单选按钮问题，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>