select隐藏选中值对应的id,显示其它id的简单实现方法


Posted in Javascript onAugust 25, 2016

由于select选项较少,做的简单,

<select name="typeid" id="typeid">
<option value="-1">-请选择类型-</option>
<option value="grade">兑换等级</option>
<option value="money">兑换现金</option>
<option value="gift">兑换礼物</option>
</select>


<tr id="grade"></tr>

<tr id="money"></tr>


<tr id="gift"></tr>


<script>
$(document).ready(function(){
var alltypes = ['grade','money','gift'];
$("#typeid").change(function(){
var type = $(this).val();
for(i=0;i<alltypes.length;i++)
{
$("#"+alltypes[i]).hide();
$("#"+type).show();
}

});
});
</script>

将所有id存放一个数组中,然后遍历隐藏所有id,只显示选中值的id

以上这篇select隐藏选中值对应的id,显示其它id的简单实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery1.3.2 升级到jQuery1.4.4需要修改的地方
Jan 06 Javascript
Javascript实现滑块滑动改变值的实现代码
Apr 12 Javascript
Javascript 数组排序详解
Oct 22 Javascript
jQuery中:only-child选择器用法实例
Jan 03 Javascript
微信小程序 页面传参实例详解
Nov 16 Javascript
AngularJS自定义指令详解(有分页插件代码)
Jun 12 Javascript
jQuery实现的回车触发按钮事件功能示例
Mar 25 jQuery
Vue cli构建及项目打包以及出现的问题解决
Aug 27 Javascript
webpack4 CSS Tree Shaking的使用
Sep 03 Javascript
vue生命周期的探索
Apr 03 Javascript
WebGL three.js学习笔记之阴影与实现物体的动画效果
Apr 25 Javascript
Vue+Element UI 树形控件整合下拉功能菜单(tree + dropdown +input)
Aug 28 Javascript
Js得到radiobuttonlist选中值的两种方法(推荐)
Aug 25 #Javascript
总结JavaScript的正则与其他语言的不同之处
Aug 25 #Javascript
js判断radiobuttonlist的选中值显示/隐藏其它模块的实现方法
Aug 25 #Javascript
jQuery实用小技巧_输入框文字获取和失去焦点的简单实例
Aug 25 #Javascript
JS实现图片延迟加载并淡入淡出效果的简单方法
Aug 25 #Javascript
JavaScript中闭包之浅析解读(必看篇)
Aug 25 #Javascript
jquery点击切换背景色的简单实例
Aug 25 #Javascript
You might like
PHP隐形一句话后门,和ThinkPHP框架加密码程序(base64_decode)
2011/11/02 PHP
php版微信公众平台之微信网页登陆授权示例
2016/09/23 PHP
PHP简单遍历对象示例
2016/09/28 PHP
PHP实现多关键字加亮功能
2016/10/21 PHP
prototype与jquery下Ajax实现的差别
2009/09/13 Javascript
jquery自定义插件开发之window的实现过程
2016/05/06 Javascript
详解Angular的内置过滤器和自定义过滤器【推荐】
2016/12/26 Javascript
基于bootstrap风格的弹框插件
2016/12/28 Javascript
过期软件破解办法实例详解
2017/01/04 Javascript
jQuery插件form-validation-engine正则表达式操作示例
2017/02/09 Javascript
详解使用grunt完成requirejs的合并压缩和js文件的版本控制
2017/03/02 Javascript
原生JS实现的双色球功能示例
2018/02/02 Javascript
用react-redux实现react组件之间数据共享的方法
2018/06/08 Javascript
一个Vue视频媒体多段裁剪组件的实现示例
2018/08/09 Javascript
解决vue 引入子组件报错的问题
2018/09/06 Javascript
ionic3双击返回退出应用的方法
2019/09/17 Javascript
javascript绘制简单钟表效果
2020/04/07 Javascript
Python格式化输出字符串方法小结【%与format】
2018/10/29 Python
python调用百度地图WEB服务API获取地点对应坐标值
2019/01/16 Python
使用python计算三角形的斜边例子
2020/04/15 Python
HTML5为输入框添加语音输入功能的实现方法
2017/02/06 HTML / CSS
Hunkemöller瑞士网上商店:欧洲最大的内衣品牌之一
2018/12/03 全球购物
Linux常见面试题
2016/10/04 面试题
优秀医生事迹材料
2014/02/12 职场文书
小学生运动会通讯稿
2014/09/23 职场文书
新闻人物通讯稿
2014/10/09 职场文书
市委召开党的群众路线教育实践活动总结大会报告
2014/10/21 职场文书
上课说话检讨书
2015/01/27 职场文书
2015年房地产销售工作总结
2015/04/20 职场文书
幼儿园教学工作总结2015
2015/05/12 职场文书
校运会通讯稿
2015/07/18 职场文书
青年文明号创建口号大全
2015/12/25 职场文书
乡镇干部学习心得体会
2016/01/23 职场文书
导游词之岳阳楼
2019/09/25 职场文书
Go语言实现一个简单的并发聊天室的项目实战
2022/03/18 Golang
安装Windows Server 2012 R2企业版操作系统并设置好相关参数
2022/04/29 Servers