根据选择不同的下拉值出现相对应的文本输入框

代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">;
<html xmlns="http://www.w3.org/1999/xhtml">;
<head>
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<title>无标题文档</title>
<script language="javascript">
function $(obj){return document.getElementById(obj);}
function show(objid) {$(objid).style.display='inline';}
function hidden(objid) {$(objid).style.display='none';}
function doit(){
var sel_val=$('sel').value;
if (sel_val=='') {hidden('a1');hidden('a2');}
if (sel_val==0) {hidden('a1');hidden('a2');}
if (sel_val==1) {show('a1');hidden('a2');}
if (sel_val==2) {show('a2');hidden('a1');}
}
</script>
</head>

<body>
<select name="sel" id="sel" onchange="javascript:doit();">
<option selected="selected">请选择</option>
<option value="0">不要输入框</option>
<option value="1">输入框1</option>
<option value="2">输入框2</option>
</select>

<input value="输入框1" type="text" name="a1" id="a1" style="display:none;" />
<input value="输入框2" type="text" name="a2" id="a2" style="display:none;" />
<br />
<br />
</body>
</html>

赞 (0)

相关推荐

  • 根据选择不同的下拉值出现相对应的文本输入框

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">; <html xmlns="http://www.w3.org/1999/xhtml">; <head> <%@ page language=

  • js实现可输入可选择的select下拉框

    js实现可输入可选择的select下拉框

    本文实例为大家分享了可输入可选择的select下拉框,供大家参考,具体内容如下 1.原理: 1.1将input输入框和select框合并在一起,但是显示出向下点击的按钮: 这种比较容易做到 1.2出现输入值能够自动匹配的功能 动态的加载一个临时的div出现在该input下方,当点击页面中的空白地方,div隐藏. 1.3代码: <!doctype html> <html lang="en"> <head> <meta charset="

  • layui下拉框获取下拉值(select)的例子

    如下所示: <script type="text/javascript"> $(document).ready(function () { layui.use('form', function(){ var form = layui.form; form.render(); form.on('select', function (data) { //alert(data.value); console.log(data.value); }); }) </script&

  • BootStrap点击下拉菜单项后显示一个新的输入框实现代码

    我的页面上有一个下拉菜单,页面上有一个文本输入框,一个图像上传框,文本输入框默认是显示的,而图片上传框是隐藏的. 假设下拉菜单有两项A和B,我想实现这样的效果:点击A时显示文本输入框,隐藏图像输入框:点击B时显示图像上传框,隐藏文本输入框,请问怎么实现? 用firebug调试的时候发现只有在加载html页面的时候几个click函数才会执行,页面加载好后点击下拉菜单项,这些断点都不会被执行,求解是怎么回事. 我的js代码如下(定义在<head>部分中): <script type=&quo

  • JavaScript实现获取select下拉框中第一个值的方法

    JavaScript实现获取select下拉框中第一个值的方法

    本文实例讲述了JavaScript实现获取select下拉框中第一个值的方法.分享给大家供大家参考,具体如下: 1.说明 获取select下拉框中的第一个值 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="

  • Flutter实现自定义下拉选择框的示例详解

    Flutter实现自定义下拉选择框的示例详解

    在一些列表页面中,我们经常会有上方筛选项的的需求,点击出现一个下拉菜单,多选.单选.列表选等,而在Flutter中,并没有现成的这样的组件,找第三方的扩展有时候又会受到一定限制,所以最好我们可以自己做一个,这样即使扩展我们也会得心应手. 先看效果图: 关键点:弹出.收回动画.状态改变.选项联动 思路: 我们可以看到一个完整的下拉框有头部和具体的下拉选项两部分组成,头部又和下拉组进行了联动, 把头部当做1个数组,下方选项作为1个数组,两个数组数量一致之间形成一个完整的下拉选择框可以更好的控制联动效

  • select获取下拉框的值 下拉框默认选中方法

    本文主要介绍select下拉框的相关方法. 1.通过id获取下拉框的value和文本值 例如: <select class="form-control" id="numbers"> <option value="1">数字1</option> <option value="2" selected>数字2</option> </select> $("

  • ajax实现动态下拉框示例

    许多页面上都涉及有下拉框,即select标签.对于简单的下拉框,被选择的数据是不需要改变的,我们可以用<option></option>写死.这样下拉框的数据永远都是那几条. 示例: <select> <option>信息一</option> <option>信息二</option> <option>信息三</option> <option>信息四</option> <

  • vue 不使用select实现下拉框功能(推荐)

    html部分:v-for循环出的结构 <div > <p @click="clickSize (item, index)">{{item.name}}</p> <transition name="opacityLeave"> <div class="condition-list" v-show="isShowSize && index == i"> &

  • C#使用NPOI设置Excel下拉选项

    本文实例为大家分享了C#使用NPOI设置Excel下拉选项的具体代码,供大家参考,具体内容如下 最近在做一个导出模板的功能,需要限制用户的某些单元格输入的内容. 期望达到的效果:单元格中出现下拉选择,或输入错误时提示. 翻阅了许多资料,终于得到了答案. 然后自己整理下边一些方法,记录下来方便以后使用. 第一种 · 直接设置下拉值,不超过255个字符(优点:逻辑简单 :缺点:有字符限制) · 适用于下拉值为固定值,例如:状态.性别等 方法块: public static void SetCellD

随机推荐