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


Posted in Javascript onAugust 01, 2013
<!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>
Javascript 相关文章推荐
自适应高度框架 ----属个人收藏内容
Jan 22 Javascript
js 剪切板应用clipboardData详细解析
Dec 17 Javascript
javascript跨浏览器的属性判断方法
Mar 16 Javascript
JavaScript实现列表分页功能特效
May 15 Javascript
仿iframe效果Aajx文件上传实例
Nov 18 Javascript
Webpack打包css后z-index被重新计算的解决方法
Jun 18 Javascript
JS库之Three.js 简易入门教程(详解之一)
Sep 13 Javascript
小程序组件之仿微信通讯录的实现代码
Sep 12 Javascript
了解前端理论:rscss和rsjs
May 23 Javascript
layui问题之渲染数据表格时,仅出现10条数据的解决方法
Sep 12 Javascript
JSONP解决JS跨域问题的实现
May 25 Javascript
jQuery弹框插件使用方法详解
May 26 jQuery
jquery图片放大功能简单实现
Aug 01 #Javascript
基于jquery的文章中所有图片width大小批量设置方法
Aug 01 #Javascript
Jquery动态更改一张位图的src与Attr的使用
Jul 31 #Javascript
jquery中选择块并改变属性值的方法
Jul 31 #Javascript
JQuery写动态树示例代码
Jul 31 #Javascript
HTML长文本截取含有HTML代码同样适用的两种方法
Jul 31 #Javascript
JS的千分位算法实现思路
Jul 31 #Javascript
You might like
PHP脚本数据库功能详解(下)
2006/10/09 PHP
PHP数组的交集array_intersect(),array_intersect_assoc(),array_inter_key()函数的小问题
2011/05/29 PHP
Laravel 5框架学习之Eloquent (laravel 的ORM)
2015/04/08 PHP
php关联数组快速排序的方法
2015/04/17 PHP
php根据数据id自动生成编号的实现方法
2016/10/16 PHP
PHP token验证生成原理实例分析
2019/06/05 PHP
javascript实现的动态添加表单元素input,button等(appendChild)
2007/11/24 Javascript
jquery插件制作简单示例说明
2012/02/03 Javascript
js 获取后台的字段 改变 checkbox的被选中的状态 代码
2013/06/05 Javascript
javascript模拟实现C# String.format函数功能代码
2013/11/25 Javascript
jquery分页对象使用示例
2014/04/01 Javascript
Angular实现form自动布局
2016/01/28 Javascript
jQuery实现控制文字内容溢出用省略号(…)表示的方法
2016/02/26 Javascript
JavaScript实现数据类型的相互转换
2016/03/06 Javascript
深入理解JavaScript中Ajax
2016/08/02 Javascript
Node.js 数据加密传输浅析
2016/11/16 Javascript
Bootstrap table使用方法详细介绍
2016/12/09 Javascript
JS简单实现移动端日历功能示例
2016/12/28 Javascript
Vue.js实现微信过渡动画左右切换效果
2017/06/13 Javascript
JavaScript实现鼠标滚轮控制页面图片切换功能示例
2017/10/14 Javascript
AngularJS实现图片上传和预览功能的方法分析
2017/11/08 Javascript
解决vue多个路由共用一个页面的问题
2018/03/12 Javascript
layui 地区三级联动 form select 渲染的实例
2019/09/27 Javascript
Node.js创建一个Express服务的方法详解
2020/01/06 Javascript
解决VUE mounted 钩子函数执行时 img 未加载导致页面布局的问题
2020/07/27 Javascript
js简单粗暴的发布订阅示例代码
2021/01/23 Javascript
python基础教程之元组操作使用详解
2014/03/25 Python
Python兔子毒药问题实例分析
2015/03/05 Python
python装饰器的特性原理详解
2019/12/25 Python
用python对excel查重
2020/12/07 Python
详解numpy1.19.4与python3.9版本冲突解决
2020/12/15 Python
HTML 5.1来了 9月份正式发布 更新内容预览
2016/04/26 HTML / CSS
《月球之谜》教学反思
2014/04/10 职场文书
教师群众路线学习心得体会
2014/11/04 职场文书
python将图片转为矢量图的方法步骤
2021/03/30 Python
js实现上传图片到服务器
2021/04/11 Javascript