JS实现用下拉框控制文本框的显示与隐藏？

最新推荐文章于 2024-05-22 13:52:22 发布
最新推荐文章于 2024-05-22 13:52:22 发布
阅读量324 收藏
点赞数
文章标签： javascript ViewUI

下拉框中有内容，如A,B,C,当选A时文本框出现，当选B时，文本框消失，高手帮帮忙！

<select οnchange="docuenmt.getElementById("文本框ID").style.display=this.selectedIndex==1)?'block':'none';" ....this.selectedIndex==1表示B项索引项



<title>控制文本框的显示隐藏</title>
</head>

<body>
<script language=javascript>
function Other_sel(CName,TextID)
{   
 if (document.FormName.CName.checked == true)
 {
  document.getElementById(TextID).style.visibility="visible";
 }
 else
 {
  document.getElementById(TextID).style.visibility="hidden";
 }
}
</script>   
<form action="" method="post" name="FormName">
<input type="checkbox" name="che" id="che" value="1" οnclick="javascript:Other_sel('che','tex')" />其他 <input id="tex" name="tex" style="visibility:hidden;">
</form>

建立一个下拉列表框，其中有选项：有时间限制和无时间限制，选有时间限制时，在界面上显示一个文本域，可以输入时间限期，如选无时间限制，文本域不显示

if   (document.forms[0].ReviewWindow.selectedIndex=0) 
        document.forms[0].ReviewTime.style.visibility= "hidden "; 
    else   
        document.forms[0].ReviewTime.style.visibility   = "visible ";

<div id= "L_Time " style= "visibility:hidden; "> <input type=text> </div>
<select οnchange= "F_Select(this) "> </select>


<script>
function F_Select(select)
{
for(iIndex=0;iIndex <select.length;iIndex++)
{
if(select.options[iIndex].selected)
{
if(select.options[iIndex].value==1)
{
L_Time.style.visibility= " ";
}
else
{
L_Time.style.visibility= "hidden ";
}
}
}
}
</script>

岁寒松柏
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue实现select下拉显示隐藏功能
12-30
今日，怂怂就来说说，在项目中刚遇到这么一个功能需求； 描述：当下拉选择不同的属性选项，需展示对应的内容界面； select下拉菜单如下： 当下拉选择【表结构变更】、即展示如下界面： 当下拉选择【接口变更】、即展示如下界面： 代码实现 vue.js： //定义一个select下拉菜单 <el-option label=接口变更 va
html设置下拉菜单文本框隐藏,JS控制文本框下方的 下拉框显示/隐藏的问题
weixin_36473811的博客
06-03 1134
情况是这样，有一个文本框，下边有一下拉框 类似日历选取那样，下拉框里有按钮可点击，当鼠标点击(或聚焦)文本框时，下拉框显示， 点击下拉框内时也不隐藏， 点击下拉框外边时(也就是任意空白地方 不包含下拉框) 才让下拉框隐藏， 但如果我绑定的是文本框的blur事件的话 ，点击下拉框的里边时也会被隐藏掉。。 那么有什么方法 可以实现 点击文本框显示，点击下拉框里边不隐藏， 点击下拉框以外时(任意空白)才...
导航菜单下拉框被文本框挡住覆盖，显示不全，如何置顶最前显示以及背景透明度？
weixin_47336389的博客
12-22 1569
解决办法： 在需要置顶显示的内容上加上： position：relative; z-index：2; 注意： 两句代码一个不能少，只写了最后一个是没有效果的，我之前一直都搞不出来就是因为少写了上面一句。 如果没有用： 可能是因为遮挡的那个内容z-index的值比需要置顶显示的内容值要大，所以在给本来要在下面的文本框加上： position：fixed; z-index：1; 背景透明度： 解决完显示问题之后：还有一个背景看起来比较透明： 在需要置顶并且背景透明内容上加上： opacity：1； 知识点： .
下拉框级联选择框，下拉框的隐藏于文本框的隐藏
kobe1qiqi的博客
11-02 913
aaaa bbb ccc dd dd
php三级联动 一个下拉框 两个文本框,基于selectBox实现多级联动的模拟下拉框–SelectBoxMulti...
weixin_39659748的博客
03-23 225
之前有写过一个模拟select框的功能插件，当时也只是支持一个单独的select，但是平时，我们经常使用到的一个功能，就是需要多个select的联动效果，正好工作中也需要该功能，于是基于之前单个selectBox的方法，实现该插件，多个联动的selectBox的插件，我这里命名为SelectBoxMulti插件。概述本插件是基于selectBox插件实现的，需要的一些参数与传入的控制属性的命名等，...
js、jquery实现列表模糊搜索功能过程解析
01-19
5. 点击文本框中的下拉键头时会切换下拉框的显示/隐藏 6. 点击文本框外部时自动隐藏下拉框 先来预览一下效果吧！ 列表中包含的列表项有： 北京、上海、杭州、安庆、大兴安岭、安阳、广州、贵阳、哈尔滨、合肥、...
js使用小技巧
07-11
Javascript小技巧一箩筐 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcElement.releaseCapture(); 事件按键 event.keyCode ...
程序天下:JavaScript实例自学手册
07-08
9.24 用JavaScript隐藏或显示表格列 9.25 滚动的表格 9.26 交换表的行 9.27 动态拖放表格的宽度 9.28 可输入内容的表格 9.29 可以分级的表格隐藏 9.30 动态创建表格并实现分页 9.31 删除表格指定行 9.32 设置表格的...
javascript代码常用大全
12-08
12，DIV层相关（拖拽、显示、隐藏、移动、增加） 13，TABLAE相关(客户端动态增加行列，模拟进度条，滚动列表等) 14，各种<object classid=>相关类，如播放器，flash与脚本互动等 16, 刷新/模拟无刷新 异步...
ant design DatePicker日期选择框指定分钟的间隔minuteStep属性
u010234868的专栏
05-17 221
在上面的例子中，DatePicker 将只允许用户以 15 分钟为间隔选择分钟。是 Ant Design 的 TimePicker时间选择框组件的一个属性。设置为 30，则用户可以选择以 30 分钟为间隔的分钟值。如果你想让分钟选项只能以 15 分钟为间隔选择，你可以将。
Vue.js的发展史（一）
2301_79683791的博客
05-15 785
Vue (发音为 /vjuː/，类似view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。来源官方解释-----简介 | Vue.js (vuejs.org)简单来说：Vue是一个属于JS的库，可直接引入一个JS文件就可以使用，与传统JS和JQuery框架不同，Vue的渐进式框架。
【学习笔记】后端（Ⅰ）—— NodeJS（Ⅱ）
Eddie_hyh的博客
05-21 510
NodeJS（Ⅱ）
React函数式组件的父子方法互相调用，父组件调用子组件方法，子组件调用父组件方法
SongZhengxing_的博客
05-18 219
子组件需要使用 forwardRef 函数包裹，然后使用 useImperativeHandle 暴露属性和方法。编写子组件 Child。
前端开发攻略---用Vue实现无限滚动的几种方法
最新发布
nibabaoo的博客
05-22 527
用vue实现无限滚动
虚拟列表 vue-virtual-scroller 的使用
小秀的博客
05-22 300
【代码】虚拟列表 vue-virtual-scroller 的使用。
【MySQL精通之路】AdminAPI-使用
Anakki的博客
05-19 692
本文介绍MySQL SHELL提供的MySQL AdminAPI，使您能够，使用它们创建和，并集成。
JavaScript函数进阶（1）——递归和堆栈
qq_60624992的博客
05-16 405
当一个函数解决一个任务时，在解决的过程中它可以调用很多其它函数。在部分情况下，函数会调用。有关正在运行的函数的执行过程的相关信息被存储在其。通过迭代的思路来实现，使用循环来实现。通过函数来不断调用自身来实现。
vue3 使用WebAssembly 实战
qq_35374791的博客
05-16 1136
文件已经正确部署，并且可以通过指定的URL访问。此外，根据你的WASM模块实际功能和导出函数，代码中的具体实现细节（如参数传递和返回值处理）可能有所不同。函数来异步加载并实例化WebAssembly模块。首先，你需要一个WebAssembly模块。假设你已经有了一个编译好的。在Vue 3组件中，你可以在。
Java swing 如何让下拉框和文本框同步显示
04-18
您可以使用 JComboBox 类来创建下拉框，使用 JTextField 类来创建文本框。然后，您可以通过添加一个事件监听器，使得当您改变下拉框中的选项时，文本框将显示相应的内容。具体实现方式可以参考以下代码： JComboBox comboBox = new JComboBox(); JTextField textField = new JTextField(); // 添加选项 comboBox.addItem("选项1"); comboBox.addItem("选项2"); comboBox.addItem("选项3"); // 添加事件监听器 comboBox.addActionListener(new ActionListener() { public void actionPerformed(ActionEvent e) { textField.setText(comboBox.getSelectedItem().toString()); } }); // 将下拉框和文本框添加到面板中并显示 JPanel panel = new JPanel(); panel.add(comboBox); panel.add(textField); JFrame frame = new JFrame(); frame.add(panel); frame.pack(); frame.setVisible(true); 这样，当您选择下拉框中的选项时，文本框将会显示相应的内容。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值