`
qimo601
  • 浏览: 3418511 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

html中点击 checkbox (radio也可以) 隐藏tr 或 展现tr

阅读更多
总结一下 html中的隐藏tr的 javascript 方法

-----------------------源码 -----------------------------------

<html>
<head>
  
   <title>点击checkbox 隐藏 展现 某行</title>
<script>
     function changeOracle(){
       
        document.getElementById("oracle1").style.display = (document.getElementById("oracle1").style.display=="")?"none":"";
       document.getElementById("oracle2").style.display = (document.getElementById("oracle2").style.display=="")?"none":"";
       }
       
</script>
</head>
<body>
   <table>
    <tr>
     <td >
      是否安装Oracle服务器:
     </td>
     <td>
      <input type="checkbox" id="oracle" name="oracle" value="1" onclick="changeOracle();" />
      &nbsp;
     </td>
     <td ></td>
     <td ></td>
    </tr>
    <tr id="oracle1" style="display:none;">
     <td >
      Oracle用户名:
     </td>
     <td >
     <input type = "text" name = "oracleUsername"/>
     </td>
     <td>
      Oracle密码:
     </td>
     <td >
      <input type = "text" name = "oraclePassword"/>
     </td>
    </tr>
    <tr id="oracle2" style="display:none;">
     <td>
      Oracle全局数据库名:
     </td>
     <td >
      <input type = "text" name = "oracleDbName"/>
     </td>
     <td ></td>
     <td ></td>
    </tr>
   </table>
</body>
</html>

 

分享到:
评论

相关推荐

    详解Bootstrap的iCheck插件checkbox和radio

    6、25 种参数 用来定制复选框(checkbox)和单选按钮(radio button) 7、8 个回调事件 用来监听输入框的状态 8、7个方法 用来通过编程方式控制输入框的状态 9、能够将输入框的状态变化同步回原始输入框中, 支持...

    表单checkbox和radio文字对齐的代码

    像type=radio and type=checkbox的对齐问题,测试浏览器:ie7+/firefox8.0 原理:将font-family中的第一个字体设置Verdana字体 测试代码如下: 复制代码代码如下: &lt;!DOCTYPE html PUBLIC “-//W3C//DTD XHTML ...

    input:checkbox多选框实现单选效果跟radio一样

    就是有时候我们使用单选radio的时候,会发现当我们选中一个之后,再也无法一个都不选了,即选中后没有取消的功能,此时便想到了功能强大的checkbox,但他是多选,怎么才能让他变成单选,效果跟radio一样呢,本菜鸟就...

    Bootstrap3 多选和单选框(checkbox)

    对于和多选或单选框联合使用的 &lt;label&gt; 标签,如果也希望将悬停于上方的鼠标设置为“禁止点击”的样式,请将 .disabled 类赋予 .radio、.radio-inline、.checkbox、.checkbox-inline 或 。 默认外观(堆叠在一起) ...

    BootStrap表单控件之复选框checkbox和单选择按钮radio

    表单控件——复选框checkbox和单选择按钮radio&lt;/title&gt; &lt;!-- 最新版本的 Bootstrap 核心 CSS 文件 --&gt; &lt;link rel=stylesheet href=https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min

    table点击表头排序

    点击表头即可实现排序的代码./*table排序步骤 1、给排序的表格加id 2、标题栏加 3、排序的内容加 5、引入此js 6、在文档的末尾加入 [removed] var to = new TableOrder("idTable"), odID = to.creat({ type: "int", ...

    jQuery选择器上机练习题及答案.rar

    (答案见下载资源) 上机任务1 用chrome打开dom.sample2.html页面...为某dom元素应用某css样式可以使用jQuery中的addClass方法,例如:将id为tt的div元素应用.bt样式,可用些语句:$("#tt").addClass("color","red");

    jQuery详细教程

    $(selector).click(function) 触发或将函数绑定到被选元素的点击事件 $(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件 $(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点...

    jQuery完全实例.rar

    你可以传递一个手写的 HTML 字符串,或者由某些模板引擎或插件创建的字符串,也可以是通过 AJAX 加载过来的字符串。但是在你创建 input 元素的时会有限制,可以参考第二个示例。当然这个字符串可以包含斜杠 (比如一...

    html入门到放弃笔记

    HTML中用于描述功能的符号称为"标记" 标记在使用时,用尖括号 "&lt;&gt;",标记的分类 1、封闭类型的标记 也称为 "双标记" , 必须成对出现 语法:&lt;标记&gt;内容标记&gt; Demo : 1、创建 p 标记 --&lt;p&gt;...&lt;/p&gt; 2、创建 ...

    php selectradio和checkbox默认选择的实现方法详解

    这是扩展yibing的select默认选择的实现方法 复制代码 代码如下:&lt;select name=”wuyeleixing” size=”1″&gt; ”1″&gt;住宅&lt;/option&gt; ”2″&gt;办公室&lt;/option&gt; &lt;option &lt;?php if($myrow[wuyeleixing]==3) echo...?

    Bootstrap复选框和单选按钮美化插件(推荐)

    只要引入上面所说的文件之后,也可以自己定制样式,代码如下: .checkbox label::before { content: ; display: inline-block; position: absolute; width: 20px; height: 20px; left: 0; margin-left: -20px; ...

    从入门到精通HTML5——PDF——网盘链接

     7.1.1 表格的基本构成——table、tr、td 119  7.1.2 表格的标题——caption 120  7.1.3 表格的表头——th 121  7.2 设置表格基本属性 123  7.2.1 表格的宽度——width 123  7.2.2 表格的高度——height...

    Bootstrap CSS布局之表单

    input textarea select checkbox radio(checkbox和radio是input的特殊类型) 其他标签 form fieldset legend 1.1.基础表单 &lt;!--基础表单: 1.向父 &lt;form&gt; 元素添加 role="form"。 2.把标签label和控件...

    fso浏览54646465465464564

    &lt;tr&gt;类型:&lt;/td&gt;&lt;td&gt;&lt;input type="radio" name="ntype" checked value="0"&gt;文件夹 &lt;input type="radio" name="ntype" value="1"&gt;文件 &lt;tr&gt;名称: 新建"&gt; &lt;tr&gt;&lt;td align=center colspan=2&gt;&lt;input type="submit" ...

    Bootstrap3 内联单选和多选框

    通过将 .checkbox-inline 或 .radio-inline 类应用到一系列的多选框(checkbox)或单选框(radio)控件上,可以使这些控件排列在一行。 &lt;label class=checkbox-inline&gt; &lt;input type=checkbox id=inlineCheckbox...

    css笔记课程笔记2019,5,22

    也可以分别设置 上下左右四个内边距 (3)外边距 margin: 20px; 可以使用margin统一设置 也可以分别设置 上下左右四个外边距 6、css的布局的漂浮(了解) float: ** 属性值 left : 文本流向对象的右边...

    asp学习笔记

    tr 行标签 td 列表签 th 标题标签 *属性: ;"&gt; &lt;input/&gt; &lt;input type=""&gt; text 文本框 button 按钮 submit 提交按钮 结合表单&lt;form标记&gt;使用 checkbox 多选框 radio 单选按钮 password...

    JQuery选择器

    DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; ...

    js使用DOM设置单选按钮、复选框及下拉菜单的方法

    单选按钮在表单中即&lt;input type=”radio” /&gt;它是一组供用户选择的对象,但每次只能选一个。每一个都有checked属性,当一项选择为ture时,其它的都变为false. 先贴上一个例子: 代码如下:[removed]  ...

Global site tag (gtag.js) - Google Analytics