<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>test</title>
<script type="text/javascript">
window.onload = function() {
var radios = document.getElementsByName('object');
for (var i = 0; i < radios.length; i++) {
radios[i].indexs = i + 1;
radios[i].onchange = function () {
if (this.checked) {
document.getElementById("id1").style.display="none";
document.getElementById("id2").style.display="none";
document.getElementById("id" + this.indexs).style.display="block";
}
}
}
}
function ex(){
if(document.getElementById("usergroup").checked==true)
{
alert(1);
}else{
alert(2);
}
}
</script>
</head>
<body>
<table>
<tr>
<td>
<input onclick="ex()" checked="checked" id="users" class="radio" type="radio" name="object" value="0" />
<label for="users">非用户组</label>
<input onclick="ex()" id="usergroup" class="radio" type="radio" name="object" value="1" />
<label for="usergroup">用户组</label>
</td>
</tr>
<tr>
<td>
<span id="id1" style="display: block;">内容1</span>
<span id="id2" style="display: none;">内容2</span>
</td>
</tr>
</table>
</body>
</html>

radio 切换内容的更多相关文章

  1. bootstrap tab切换如何让鼠标移动自动切换内容

    bootstrap集成了很多功能,比如nav-tabs组件,可以将相似的内容集中在一个区块中展示.bootstrap tab切换默认是要点击才会切换的,如何实现鼠标移动就自动切换呢?如下图所示,光标移 ...

  2. 小程序TAB列表切换内容动态变化，scrollview高度根据内容动态获取

    滑动tab选项卡 一.在小程序里面tab选项卡是用的是自带的swiper组件,下面直接上代码 <view class="container"> <view cla ...

  3. vue中的tab栏切换内容变换

    <!DOCTYPE html> <html lang="cn-zh"> <head> <meta charset="UTF-8& ...

  4. radio切换，点击方法onclick

    <label><input name="Status1" type="radio" value="first" check ...

  5. JQ实现点击两个按钮切换内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  6. js实现点击不同按钮切换内容

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. iframe切换内容页仍然能自适应大小代码（含js）

    function setIframeHeight(iframe) { if (iframe) { var iframeWin = iframe.contentWindow || iframe.cont ...

  8. 禁止mui事件tab切换内容左右滑动

    mui('.mui-slider').slider().setStopped(true);

  9. C# 简单反射实现winform左侧树形导航，右侧切换内容

    先看看效果: 核心代码: using System; using System.Collections.Generic; using System.ComponentModel; using Syst ...

随机推荐

  1. 文件缓存（配合JSON数组）

    1.  写入缓存:建立文件夹,把list集合里面的数组转换为JSON数组,存入文件夹2.  读取缓存:把JSON数组从文件夹里面读取出来,然后放入list集合,返回list集合 private fin ...

  2. 使用mac终端生成RSA私钥和公钥文件

    89:~ zhangwenquan$ 89:~ zhangwenquan$ openssl OpenSSL> genrsa -out rsa_private_key.pem 1024 Gener ...

  3. Markdown简介以及常用语法

    Markdown简介以及常用语法 最近发现用markdown记录东西很方便,感觉和emacs的org mode很类似,但是windows下使用emacs不是很方便.特此记录一下markdown常用的语 ...

  4. Vmware虚拟机Devstack安装openstack（All in one）

    Vmware虚拟机Devstack安装openstack(All in one) 博客园第一篇博客,先练习一下. 官方文档 环境 Vmware虚拟机 OS : Ubuntu 14.04 Nat网络,D ...

  5. Android LayoutInflater.inflate(int resource, ViewGroup root, boolean attachToRoot)的参数理解

    方法inflate(int resource, ViewGroup root, boolean attachToRoot) 中 第一个参数传入布局的资源ID,生成fragment视图,第二个参数是视图 ...

  6. 怎么定制属于自己的GitHub主页呢？

    Either you fuck the life or the life fucks you. My personal GitHub page Creating a GitHub Pages site ...

  7. javascript中的原型和继承

    javascript一直是初学者口中的难点,甚至一些有些许工作经验的人也不太明白其中的原理,而我就是那个初学者,前段时间在阮一峰老师的博客上看了一篇文章<javascript继承机制的设计思想& ...

  8. struts-tags通用标签基本用法

    2017-01-07 16:02:46 <s:debug></s:debug><!-- 标签库中实现的debug --> ${name }<!-- 是从对象栈 ...

  9. vs2013 打开vs2010 找不到此项目类型所基于的应用程序 MVC2 升级 MVC5 不能加载Web项目

    Upgrading an ASP.NET MVC 2 Project to ASP.NET MVC 3 Tools Update ASP.NET MVC 3 can be installed side ...

  10. chpasswd-批量修改用户密码

    批量修改用户密码 工作原理: 从系统的标准输入读入用户的名称和口令,并利用这些信息来更新系统上已存在的用户的口令 语法: :# echo 用户名:密码 | chpasswd :# chpasswd & ...