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 相关文章推荐
jquery 常用操作方法
Jan 28 Javascript
有趣的javascript数组定义方法
Sep 10 Javascript
node.js中的http.response.write方法使用说明
Dec 14 Javascript
jQuery遍历页面所有CheckBox查看是否被选中的方法
Apr 14 Javascript
浅谈javascript中onbeforeunload与onunload事件
Dec 10 Javascript
移动端 一个简单易懂的弹出框
Jul 06 Javascript
Node.JS中快速扫描端口并发现局域网内的Web服务器地址(80)
Sep 18 Javascript
用ES6写全屏滚动插件的示例代码
May 02 Javascript
Element-UI中Upload上传文件前端缓存处理示例
Feb 21 Javascript
灵活使用console让js调试更简单的方法步骤
Apr 23 Javascript
JavaScript中AOP的实现与应用
May 06 Javascript
Vue.js实现备忘录功能
Jun 26 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 和 MySQL 基础教程(一)
2006/10/09 PHP
PHP二维数组的去重问题解析
2011/07/17 PHP
php 按指定元素值去除数组元素的实现方法
2011/11/04 PHP
php实现网页端验证码功能
2017/07/11 PHP
javascript 避免闭包引发的问题
2009/03/17 Javascript
Asp.net下利用Jquery Ajax实现用户注册检测(验证用户名是否存)
2010/09/12 Javascript
jQuery prev ~ siblings选择器使用介绍
2013/08/09 Javascript
将json当数据库一样操作的javascript lib
2013/10/28 Javascript
基于jquery扩展漂亮的下拉框可以二次修改
2013/11/19 Javascript
jquery制作漂亮的弹出层提示消息特效
2014/12/23 Javascript
微信开发 JS-SDK 6.0.2 经常遇到问题总结
2016/12/08 Javascript
Angular1.x复杂指令实例详解
2017/03/01 Javascript
兼容浏览器的js事件绑定函数(详解)
2017/05/09 Javascript
详解AngularJS ng-class样式切换
2017/06/27 Javascript
Vue入门之animate过渡动画效果
2018/04/08 Javascript
vue中使用gojs/jointjs的示例代码
2018/08/24 Javascript
vuex2中使用mapGetters/mapActions报错的解决方法
2018/10/20 Javascript
基于vue实现圆形菜单栏组件
2019/07/05 Javascript
JS精确判断数据类型代码实例
2019/12/18 Javascript
微信小程序picker组件两列关联使用方式
2020/10/27 Javascript
[02:27]2018DOTA2亚洲邀请赛赛前采访-OpTic
2018/04/03 DOTA
在Linux下调试Python代码的各种方法
2015/04/17 Python
Python迭代和迭代器详解
2016/11/10 Python
Django中ORM表的创建和增删改查方法示例
2017/11/15 Python
pymysql模块的使用(增删改查)详解
2019/09/09 Python
python验证码图片处理(二值化)
2019/11/01 Python
TensorFlow学习之分布式的TensorFlow运行环境
2020/02/05 Python
python 使用递归的方式实现语义图片分割功能
2020/07/16 Python
ghd官网:英国ghd直发器品牌
2018/05/04 全球购物
《挑山工》的教学反思
2014/02/16 职场文书
《画家乡》教学反思
2014/04/22 职场文书
祖国在我心中的演讲稿
2014/05/04 职场文书
团日活动总结报告
2014/06/25 职场文书
晚会主持人开场白台词
2015/05/28 职场文书
2016大学军训通讯稿
2015/11/25 职场文书
用React Native制作一个简单的游戏引擎
2021/05/27 Javascript