<!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. Oracle导入导出

    Oracle 10g 已经引入了数据泵(点击Data Dump)技术,这项技术和之前的exp/imp有哪些好处呢,简单的来说就是恢复和备份速度非常快: 在说明数据泵的使用方法之前,我们先来了解二者的区 ...

  2. Redis在游戏服务器中的应用

    排行榜游戏服务器中涉及到很多排行信息,比如玩家等级排名.金钱排名.战斗力排名等.一般情况下仅需要取排名的前N名就可以了,这时可以利用数据库的排序功能,或者自己维护一个元素数量有限的top集合.但是有时 ...

  3. Servlet过滤器

    Servlet过滤器 [TOC] 1.过滤器的基本概念 1.1.基本概念 过滤器(Filter)属于tomcat服务器中的Servlet功能.在普通的javaweb服务中,jsp中的请求要被Servl ...

  4. [No00008C]图解SQL的各种连接join让你对SQL的连接一目了然

    对于SQL的Join,在学习起来可能是比较乱的.我们知道,SQL的Join语法有很多inner的,有outer的,有left的,有时候,对于Select出来的结果集是什么样子有点不是很清楚.Codin ...

  5. java中transient关键字的作用

    Java有个特点就是序列化,简单地来说就是可以将这个类存储在物理空间(当然还是以文件的形式存在),那么当你从本地还原这个文件时,你可以将它转换为它本身.这可以极大地方便网络上的一些操作,但同时,因为涉 ...

  6. C#中ToString()格式详解

    以下内容均摘自博客园,仅供资料查询. ToString格式化 在很多对象显示为字符串的时候都会使用到ToString中的格式化,由于以前没怎么注意到这个问题,想总结一下各个基础结构对象的格式化,以便后 ...

  7. pcl曲面重建模块-poisson重建算法示例

    poisson曲面重建算法 pcl-1.8测试通过 #include <iostream> #include <pcl/common/common.h> #include &l ...

  8. [LeetCode] Range Sum Query 2D - Mutable 二维区域和检索 - 可变

    Given a 2D matrix matrix, find the sum of the elements inside the rectangle defined by its upper lef ...

  9. [LeetCode] Validate Binary Search Tree 验证二叉搜索树

    Given a binary tree, determine if it is a valid binary search tree (BST). Assume a BST is defined as ...

  10. [LeetCode] Insert Interval 插入区间

    Given a set of non-overlapping intervals, insert a new interval into the intervals (merge if necessa ...