用JQuery实现选中select里面的option显示对应的div
HTML:
<select name="" onchange="select(this)">
<option value="1">题目一</option>
<option value="2">题目二</option>
<option value="3">题目三</option>
<option value="4">题目四</option>
</select>
<div>
<div id="div1">内容一
</div>
<div id="div2" style="display:none">内容二
</div>
<div id="div3" style="display:none">内容三
</div>
<div id="div4" style="display:none">内容四
</div>
</div>
//我试过,内容标签只能用id,不能用class.
//而且js的文件名不能为select。
JS:
function select(obj){
$("#div" + obj.value).show().siblings().hide();
//找到内容的标签 + 点击select获得的value值,让它显示,再让他的兄弟标签隐藏。
}
用JQuery实现选中select里面的option显示对应的div的更多相关文章
- 5.用JQuery实现选中select里面的option显示对应的div
用JQuery实现选中select里面的option显示对应的div HTML: <select name="" onchange="select(this)&q ...
- legend---七、jquery如何选中select的selected的选择上的自定义属性
legend---七.jquery如何选中select的selected的选择上的自定义属性 一.总结 一句话总结:用冒号属性选择器 var type=$(this).children('option ...
- js和Jquery获取选中select值和文本
<body> <select name="PaymentType" style="width:110px" > <option v ...
- jquery获取选中select的文本,值等
jquery获取select选择的文本与值获取select :获取select 选中的 text : $("#ddlregtype").find("option:s ...
- jQuery操作选中select下拉框的值
js和jQuery联合操作dom真的很好用,如果不是专业前端人员的话,我觉得吧前端语言只要熟练掌握js和jQuery就可以了. 获取select下拉框的几种情况如下: 1.获取第一个option的值 ...
- 【JSP EL】使用EL表达式比较 动态选中 select中的option
<option value="${k.key }" ${KPIThis.parent.parent.thisId == k.key ? "selected" ...
- 根据select中选定option触发不同事件
做公司项目,要实现一个小需求,根据下拉框选定的数据,绑定不同的事件.我的思路是获取select下面的option值,然后给它们定义不同的点击事件,但是在使用中option不能添加类,同时没有click ...
- jQuery动态生成<select>下拉框
前一阵在项目里需要动态生成下拉框,找了一下用jQuery实现比较方便,这里整理一下. 下文所述方法只是本人在项目中遇到问题的解决方法,场景较为简单,也希望能帮助有需要的朋友 1.动态生成下拉框的两种方 ...
- jquery操作select下拉框的各种方法,获取选中项的值或文本,根据指定的值或文本选中select的option项等
简介jquery里对select进行各种操作的方法,如联动.取值.根据值或文本来选中指定的select下拉框指定的option选项,读取select选中项的值和文本等. 这一章,站长总结一下jquer ...
随机推荐
- .net中RSA加密解密
1.产生密钥: private static void CreateKey() { using (RSACryptoServiceProvider rsa = new RSACryptoService ...
- 【转】Java实现将文件或者文件夹压缩成zip
转自:https://www.cnblogs.com/zeng1994/p/7862288.html package com.guo.utils; import java.io.*; import j ...
- 专题七:UDP编程补充——UDP广播程序的实现
一.程序实现 UDP广播程序的实现代码: using System; using System.Net; using System.Net.Sockets; using System.Text; us ...
- oracle数据库定时备份
现有需求,设计一批处理文件,实现周一全部备份,周二周三周五周六增量备份,周四周日累计备份.并且每日将上个月本日数据删除(如今日8月7号,则删除7月7号的数据).并将备份压缩以减小所占空间. 思路: 备 ...
- SpringBoot中如何使用jpa和jpa的相关知识总结
jpa常用的注解: 注解 解释 @Entity 声明类为实体或表. @Table 声明表名. @Basic 指定非约束明确的各个字段. @Embedded 指定类或它的值是一个可嵌入的类的实例的实体的 ...
- Apache Maven 3.0.3 (yum) 安裝 (CentOS 6.4 x64)
介紹http://maven.apache.org/ Maven是一個專案的開發,管理和綜合工具. 下載http://maven.apache.org/download.cgi 參考http://ma ...
- Java图形界面GUI
Java图形界面GUI 设置窗体JFrame对象 package com.Aha.Best; import javax.swing.ImageIcon; import javax.swing.JFra ...
- oracle文件 结构01
1.减少数据的冗余(例如使用id) 2.保证数据库一致性 关联表越多越慢 主机名 hosts 文件 ntp 时间同步
- windows10下win+R快速打开程序
按下win+R进入运行窗口,输入应用程序名称按下回车键 即可打开该应用,若提示“windows找不到文件”,请看下一步 可以采用建立统一的目录管理,新建目录“F:/local/bin” 将新建目录的路 ...
- canvas练手项目(三)——Canvas中的Text文本
Canvas中的Text文本也是一个知识点~,我们需要掌握一下几个基本的Text操作方法 首先是重要参数textAlign和textBaseline: textAlign left center ri ...