利用JavaScript控制单选框

CoderDream

浏览: 477387 次
性别:
来自: 武汉

最近访客更多访客>>

allen900625

mikeachan

lan7916

chenweiy5120

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

Java基础技术

JavaScript F#J#

<script>
function f(index){
	var x=document.getElementsByName("radiobutton");
	for(var i=0;i<x.length;i++){
		if(x[i].value==index)	{
			x[i].checked=true;
			break;
		}
	}
}
</script>

<body>
	<FORM METHOD=POST ACTION="">			
		<input type="radio" name="radiobutton" value="1" />
		1
		<input type="radio" name="radiobutton" value="2" />
		2
		<input type="radio" name="radiobutton" value="3" />
		3
		<input type="radio" name="radiobutton" value="4" />
		4
		<input type="radio" name="radiobutton" value="5" />
		5
		<br>
		<input type="button" name="s1" value="OK1" onclick="f(1);" />
		<input type="button" name="s2" value="OK2" onclick="f(2);" />
		<input type="button" name="s3" value="OK3" onclick="f(3);" />
		<input type="button" name="s4" value="OK4" onclick="f(4);" />
		<input type="button" name="s5" value="OK5" onclick="f(5);" />
	</FORM>
</body>

参考：如何控制单选、复选、列表框

一些频繁使用的javascript页面控制，做个总结。
下面是部分代码。

<html>
	<head>
		<script language="javascript">
 function a(){
  window.document.getElementsByName("dx")[0].checked=true;
 }
 function b(){
  window.document.getElementsByName("dx")[0].checked=false;
 }
 function c(){
  window.document.getElementsByName("fx")[0].checked=true;
 }
 function d(){
  window.document.getElementsByName("fx")[0].checked=false;
 }
 function e(){
  for(i=0;i<window.document.getElementsByName("fx").length;i++){
      if(!window.document.getElementsByName("fx")[i].checked){
       window.document.getElementsByName("fx")[i].checked=true;
      }
     }
 }
 function f(){
  for(i=0;i<window.document.getElementsByName("fx").length;i++){
      if(window.document.getElementsByName("fx")[i].checked){
       window.document.getElementsByName("fx")[i].checked=false;
      }
     }
 }
 function g(){
  window.document.getElementById("lbka")[1].selected=true;
 }
 function h(){
  alert(" 选择号为:"+window.document.getElementById("lbka").selectedIndex 
  + "    值为:" +
  window.document.getElementById("lbka")[window.document.getElementById("lbka").selectedIndex].value
  +"    文本值为:" + 
  window.document.getElementById("lbka")[window.document.getElementById("lbka").selectedIndex].text);
 }
 function m(){
  sel = false;
  var val="";
     for(i=0;i<window.document.getElementsByName("dx").length;i++){
      if(window.document.getElementsByName("dx")[i].checked){
       val = window.document.getElementsByName("dx")[i].value;
       sel=true;
    break;
      }  
     }
    if(sel){
   alert("单选值为:"+val);
     
     }else{
   alert("请选择文件");
      return false;
  }  
 }
 function j(){
  var sel = false;
  var val="";
     for(i=0;i<window.document.getElementsByName("fx").length;i++){
      if(window.document.getElementsByName("fx")[i].checked){
       if(val==""){
        val=window.document.getElementsByName("fx")[i].value;
       }else{
        val = val + "," +window.document.getElementsByName("fx")[i].value;
       } 
      }
     }
     if(val==""){
      alert("请选择文件");
      return false;
     }else{
   alert("复选值为:"+val);
  }
 }
</script>
	</head>
	<body>
		<table id="table1" width="100%" border="1" align="center"
			cellpadding="0" cellspacing="0">
			<tr>
				<td>
					文件
				</td>
				<td>
					列表框
				</td>
				<td>
					单选
				</td>
				<td>
					复选
				</td>
			</tr>
			<tr>
				<td>
					文件A
				</td>
				<td>
					<select name="lbka">
						<option value="lbka1">
							文件A1
						</option>
						<option value="lbka2">
							文件A2
						</option>
					</select>
				</td>
				<td>
					<input type="radio" name="dx" value="dxa">
				</td>
				<td>
					<input type="checkbox" name="fx" value="fxa">
				</td>
			</tr>
			<tr>
				<td>
					文件B
				</td>
				<td>
					<select name="lbkb">
						<option value="lbkb1">
							文件B1
						</option>
						<option value="lbkb2">
							文件B2
						</option>
					</select>
				</td>
				<td>
					<input type="radio" name="dx" value="dxb">
				</td>
				<td>
					<input type="checkbox" name="fx" value="fxb">
				</td>
			</tr>
			<tr>
				<td colspan="4">
					<a href="#" onclick="a();">单选A选中</a>
					<a href="#" onclick="b();">单选A不选中</a>
					<a href="#" onclick="c();">复选A选中</a>
					<a href="#" onclick="d();">复选A不选中</a>
					<a href="#" onclick="e();">复选全选</a>
					<a href="#" onclick="f();">复选全不选</a>
					<a href="#" onclick="g();">选中列表框文件A2</a>
					<a href="#" onclick="h();">取得选中列表框A的值,文本</a>
					<a href="#" onclick="m();">判断单选选择</a>
					<a href="#" onclick="j();">判断复选选择</a>
				</td>
			</tr>
		</table>
	</body>
</html>

分享到：

Calendar与java.sql.Date | JSP中使用JavaScript重定向页面

2008-12-04 19:14
浏览 2308
评论(0)
论坛回复 / 浏览 (0 / 3354)
分类:非技术
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

利用JavaScript控制单选框

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

利用JavaScript控制单选框

评论

发表评论

相关推荐

Spring Security 3.0 记住密码功能

解决JavaMail发邮件抛出找不到SharedByteArrayInputStream类的异常

怎样让Word自动更新图片与表格编号

W3C_School在线教程chm版制作教程

String与StringBuffer区别详解

Spring 3.0 新特性

iText生成PDF时表头设置错误导出数据不能完全导出

事务管理入门-JDBC/Hibernate事务管理器/Spring注解 3种方式

JavaMail

IBM Ajax系列教程

项目经验之弹出页面再弹出页面

正则表达式使用之替换多个字符串

OGNL的jar档、文档和源代码

Calendar与java.sql.Date

JSP中使用JavaScript重定向页面

如何去掉 Code Pro 的警告标志

使用Struts提交多行数据

Ant使用经验

利用JXL(JExcelApi)操作Excel文档

JSP下载文档

最近访客更多访客>>