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 相关文章推荐
FF IE兼容性的修改小结
Sep 02 Javascript
Domino中运用jQuery读取视图内容的方法
Oct 21 Javascript
能说明你的Javascript技术很烂的五个原因分析
Oct 28 Javascript
javascript中将Object转换为String函数代码 (json str)
Apr 29 Javascript
纯文字版返回顶端的js代码
Aug 01 Javascript
判断在css加载完毕后执行后续代码示例
Sep 03 Javascript
在Node.js中使用HTTP上传文件的方法
Jun 23 Javascript
require.js+vue开发微信上传图片组件
Oct 27 Javascript
详解AngularJS 路由 resolve用法
Apr 24 Javascript
Material(包括Material Icon)在Angular2中的使用详解
Feb 11 Javascript
Vue项目实现换肤功能的一种方案分析
Aug 28 Javascript
详解webpack-dev-middleware 源码解读
Mar 23 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 FOR MYSQL 代码生成助手(根据Mysql里的字段自动生成类文件的)
2011/07/23 PHP
PHP file_exists问题杂谈
2012/05/07 PHP
PHP获取文件行数的方法
2015/06/10 PHP
php获取文件后缀的9种方法
2016/03/22 PHP
php微信公众账号开发之前五个坑(一)
2016/09/18 PHP
visual studio code 调试php方法(图文详解)
2017/09/15 PHP
基于PHP实现的多元线性回归模拟曲线算法
2018/01/30 PHP
laravel + vue实现的数据统计绘图(今天、7天、30天数据)
2018/07/31 PHP
让Firefox支持event对象实现代码
2009/11/07 Javascript
js 判断js函数、变量是否存在的简单示例代码
2014/03/04 Javascript
Egret引擎开发指南之视觉编程
2014/09/03 Javascript
IE6 hack for js 集锦
2014/09/23 Javascript
JavaScript实现时间倒计时跳转(推荐)
2016/06/28 Javascript
Bootstrap栅格系统的使用和理解2
2016/12/14 Javascript
vue学习笔记之vue1.0和vue2.0的区别介绍
2017/05/17 Javascript
AngularJS实现动态切换样式的方法分析
2018/06/26 Javascript
JS根据json数组多个字段排序及json数组常用操作
2019/06/06 Javascript
Vue图片浏览组件v-viewer用法分析【支持旋转、缩放、翻转等操作】
2019/11/04 Javascript
node.js基于dgram数据报模块创建UDP服务器和客户端操作示例
2020/02/12 Javascript
在vue中使用vant TreeSelect分类选择组件操作
2020/11/02 Javascript
[01:05:40]VG vs Newbee 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
[07:37]DOTA2-DPC中国联赛2月2日Recap集锦
2021/03/11 DOTA
详解Python中的四种队列
2018/05/21 Python
python 随机打乱 图片和对应的标签方法
2018/12/14 Python
在python下使用tensorflow判断是否存在文件夹的实例
2019/06/10 Python
Python 操作SQLite数据库的示例
2020/10/16 Python
用css3制作纸张效果(外翻卷角)
2013/02/01 HTML / CSS
JBL美国官方商店:扬声器、耳机等
2019/12/01 全球购物
NYX Professional Makeup俄罗斯官网:世界知名的化妆品品牌
2019/12/26 全球购物
机械设计专业应届生求职信
2013/11/21 职场文书
给老婆大人的检讨书
2014/02/24 职场文书
死亡证明书样本说明
2014/10/18 职场文书
群众路线领导班子整改方案
2014/10/25 职场文书
邀请函范文
2015/02/02 职场文书
Python控制台输出俄罗斯方块移动和旋转功能
2021/04/18 Python
SQL Server中T-SQL标识符介绍与无排序生成序号的方法
2022/05/25 SQL Server