`
qimo601
  • 浏览: 3439448 次
  • 性别: 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>

 

分享到:
评论

相关推荐

    Bootstrap3 多选和单选框(checkbox)

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

    关于HTML中表格的使用

    ### 关于HTML中表格的使用 #### 一、表格的基本概念与作用 在网页设计中,HTML 表格被广泛用于展示数据结构化的信息。它能够帮助用户更清晰地理解和组织数据,尤其适用于呈现列表、统计信息等。通过合理利用表格的...

    详解Bootstrap的iCheck插件checkbox和radio

    Bootstrap的iCheck插件是一款强大的复选框(checkbox)和单选按钮(radio button)美化与功能增强工具,尤其适合于跨平台和设备的应用。它不仅确保在不同的浏览器(包括IE6+)和设备(桌面及移动设备)上提供一致的...

    表单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一样呢,本菜鸟就...

    HTML实现注册页面资源

    复选框(Checkbox)则允许用户选择一个或多个选项。在HTML中,`&lt;input type="checkbox"&gt;`用于创建复选框。例如: ```html &lt;input type="checkbox" id="newsletter" name="interests" value="news"&gt; 订阅新闻通讯 ...

    htnnl--3.表格、表单

    3. **表单动作**: `action`属性定义了表单数据提交的URL,可以是同一页面的处理函数,也可以是其他服务器端脚本。 4. **表单域**: `&lt;fieldset&gt;`用于逻辑分组表单元素,`&lt;legend&gt;`定义了该分组的标题。 5. **验证**: ...

    HTML完全中文帮助文档

    表单是HTML中处理用户输入的重要部分,`&lt;form&gt;`标签定义了一个表单,`&lt;input&gt;`标签则用于创建各种类型的输入字段,如文本框(type="text"),复选框(type="checkbox"),单选按钮(type="radio")等。`&lt;button&gt;`...

    html_mytest_code_and_note_version0.1

    2. a.html:这可能讲解了HTML中的超链接()标签,如何创建内部和外部链接,以及链接的属性如href和target等。 3. tr_td4.html:继续扩展表格的内容,可能涉及更复杂的表格布局或功能。 4. ur_ol.html:这可能涵盖...

    北京圣思园张龙 java web HTML.pdf

    根据提供的文件信息,我们可以深入探讨其中涉及的关键知识点。这些知识点主要围绕HTML中的基本元素展开,特别是与表格、超链接及表单相关的标签。下面将逐一进行详细的解释。 ### 关于表格的HTML标签 在HTML中,`...

    html的表单注册信息的一部分啊.txt

    ῑϰ&lt;input type="checkbox" name="hobby" value="11"/&gt; &lt;/td&gt;&lt;/tr&gt; ``` - **`type="checkbox"`**:表示这是一个复选框。 - **`name`**:具有相同`name`属性的复选框可以被同时选中。 #### 3.8 视频播放器 ```...

    HTML思维导图表单表格详细汇总版

    根据提供的文件信息,本文将对HTML中的表单与表格相关内容进行详细的知识点总结与解析,同时结合思维导图的方式帮助理解各个元素之间的关联性及应用情境。 ### HTML表单(Forms) #### 概述 HTML 表单是网页中收集...

    HTML标记参考大全.rar_HTML 参考 大全_HTML 参考大全_html_写手

    它可以有多种类型,如`type="text"`、`type="password"`、`type="checkbox"`、`type="radio"`等,每种类型对应不同的用户交互。 2. `OBJECT.html`: `object`标签用于嵌入外部资源,如图像、视频、Java Applets或...

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

    在HTML中,`&lt;select&gt;`元素用于创建下拉列表,而`&lt;option&gt;`元素则定义了用户可以选择的选项。为了设置默认选择,我们需要在PHP中检查服务器端的变量是否与选项的值相匹配。如果匹配,就在`&lt;option&gt;`标签内使用`...

    layui默认选中table的CheckBox复选框方法

    在本文中,我们将深入探讨如何在layui框架中实现默认选中table的CheckBox复选框。layui是一款流行的前端组件库,提供了丰富的UI组件,包括表格(table)和复选框(CheckBox)。在数据展示或者数据操作的场景中,我们...

    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

    JavaWeb开发基础之Html详解

    5. **图片超链接**:同样也可以将图片作为超链接的一部分。示例代码如下: ```html &lt;a href="http://www.baidu.com"&gt;&lt;img src="pa.jpg" /&gt; ``` 6. **文字修饰**:可以使用特定的标签来对文字进行修饰,如删除线...

    html语言教程(html版)

    此外,HTML还支持创建各种形式的表单,`&lt;form&gt;`元素结合`&lt;input&gt;`(输入框)、`&lt;textarea&gt;`(多行文本输入)、`&lt;select&gt;`(下拉列表)、`&lt;checkbox&gt;`(复选框)和`&lt;radio&gt;`(单选按钮)等元素,可以收集用户数据。...

    北大青鸟html内测

    HTML中的元素用于创建表格,包括、、、&lt;tr&gt;、和等元素。表单则用于用户输入数据,常用元素有(多种类型如text、password、checkbox、radio等)、、和等。 【CSS样式控制】 虽然“北大青鸟html内测”主要关注HTML,...

    HTML代码效果对比学习光盘(中)

    表格可以嵌套,也可以通过colspan和rowspan属性合并单元格。 七、图像 标签插入图像,需要指定src属性为图像源URL,alt属性提供替代文字,对于无法显示图像的环境很有用。 八、HTML5新增元素 HTML5引入了许多新的...

Global site tag (gtag.js) - Google Analytics