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的更多相关文章

  1. 5.用JQuery实现选中select里面的option显示对应的div

    用JQuery实现选中select里面的option显示对应的div HTML: <select name=""  onchange="select(this)&q ...

  2. legend---七、jquery如何选中select的selected的选择上的自定义属性

    legend---七.jquery如何选中select的selected的选择上的自定义属性 一.总结 一句话总结:用冒号属性选择器 var type=$(this).children('option ...

  3. js和Jquery获取选中select值和文本

    <body> <select name="PaymentType" style="width:110px" > <option v ...

  4. jquery获取选中select的文本,值等

    jquery获取select选择的文本与值获取select :获取select 选中的 text :    $("#ddlregtype").find("option:s ...

  5. jQuery操作选中select下拉框的值

    js和jQuery联合操作dom真的很好用,如果不是专业前端人员的话,我觉得吧前端语言只要熟练掌握js和jQuery就可以了. 获取select下拉框的几种情况如下: 1.获取第一个option的值 ...

  6. 【JSP EL】使用EL表达式比较 动态选中 select中的option

    <option value="${k.key }" ${KPIThis.parent.parent.thisId == k.key ? "selected" ...

  7. 根据select中选定option触发不同事件

    做公司项目,要实现一个小需求,根据下拉框选定的数据,绑定不同的事件.我的思路是获取select下面的option值,然后给它们定义不同的点击事件,但是在使用中option不能添加类,同时没有click ...

  8. jQuery动态生成<select>下拉框

    前一阵在项目里需要动态生成下拉框,找了一下用jQuery实现比较方便,这里整理一下. 下文所述方法只是本人在项目中遇到问题的解决方法,场景较为简单,也希望能帮助有需要的朋友 1.动态生成下拉框的两种方 ...

  9. jquery操作select下拉框的各种方法,获取选中项的值或文本,根据指定的值或文本选中select的option项等

    简介jquery里对select进行各种操作的方法,如联动.取值.根据值或文本来选中指定的select下拉框指定的option选项,读取select选中项的值和文本等. 这一章,站长总结一下jquer ...

随机推荐

  1. android序列化(1)Parcelable与Serializable

    1.Android中实现序列化有两个选择 一是实现Serializable接口(是JavaSE本身就支持的),实现Serializable接口非常简单. 一是实现Parcelable接口(是Andro ...

  2. Visual Studio Code -VS Code

    VS Code 免费开源的编辑器,支持 windows. mac. Linux. 微软出品 官网:https://code.visualstudio.com/ 下载地址:https://code.vi ...

  3. Java 8 (8) 默认方法

    传统上,Java程序的接口是将相关方法按照预定组合到一起的方式.实现接口的类必须为接口中定义的方法提供一个实现,或者从父类中集成它的实现.但是,一旦类库的设计者需要更新接口,向接口中加入新的方法时候, ...

  4. RabbitMQ指南之四:路由(Routing)和直连交换机(Direct Exchange)

    在上一章中,我们构建了一个简单的日志系统,我们可以把消息广播给很多的消费者.在本章中我们将增加一个特性:我们可以订阅这些信息中的一些信息.例如,我们希望只将error级别的错误存储到硬盘中,同时可以将 ...

  5. log4j2异步日志解读(一)AsyncAppender

    log4j.logback.log4j2 历史和关系,我们就在这里不展开讲了.直接上干货,log4j2突出于其他日志的优势,异步日志实现. 看一个东西,首先看官网文档 ,因为前面文章已经讲解了disr ...

  6. 重新学习Java——对象和类(一)

    之前通过记笔记的方法,对于<Java核心技术>这本书的前一章进行了重新的复习,感觉效果很好,比单独看书带来了更好的复习效果,了解了很多以前不是很注意的一些细节,但是在一些自己较为熟悉的地方 ...

  7. struts2之actionSupport学习

    actionSupport在手工完成字段验证,显示错误消息,国际化等情况下推荐使用.

  8. 【sqli-labs】 less63 GET -Challenge -Blind -130 queries allowed -Variation2 (GET型 挑战 盲注 只允许130次查询 变化2)

    引号闭合 http://192.168.136.128/sqli-labs-master/Less-63/?id=1' or '1'='1 剩下的和Less62一样

  9. document.mozFullScreen

    非标准该特性是非标准的,请尽量不要在生产环境中使用它! 概述 返回一个布尔值,表明当前文档是否处于全屏模式. 语法 var isFullScreen = document.mozFullScreen ...

  10. Protecting resources in iPhone and iPad apps

    源码:https://github.com/lingzhao/EncryptedResourceDemo UPDATE: The example project has been updated to ...