jQuery实现监听下拉框选中内容发生改变操作示例


Posted in jQuery onJuly 13, 2018

本文实例讲述了jQuery实现监听下拉框选中内容发生改变操作。分享给大家供大家参考,具体如下:

jQuery代码部分:

<script>
    $(document).ready(function(){
      var defaultId = "${defaultSelected}";
      var defaultTime = "${timeName}";
      $("select option").each(function(){
        if($(this).val()==defaultId || $(this).val()==defaultTime){
          $(this).attr("selected","selected");
        }
      });
      $("#all").change(function(){
        //alert(document.getElementById("allItem").selected);
        if(document.getElementById("allItem").selected == true){
          $("#timeText").hide();
          $("#timeSelect").hide();
        }else{
          $("#timeText").show();
          $("#timeSelect").show();
        }
      });
    });
</script>

HTML部分:

<form action="${baseUrl}/report/issueStatus.shtml">
  <span>Select a project:</span>
  <select name="selectedProId" id="all">
    <c:forEach items="${projectNameId}" var="pi">
      <option value="${pi.value}">${pi.key}</option>
    </c:forEach>
    <option value="-1" id="allItem">All</option>
  </select>
  <span id="timeText">Select a time horizon:</span>
  <select name="timeHorizon" id="timeSelect">
    <option value="Week">Last week</option>
    <option value="Month">Last month</option>
  </select>
  <button type="submit" id="submit">search</button>
</form>

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery插件FusionCharts实现的MSBar3D图效果示例【附demo源码】
Mar 23 jQuery
JS/jquery实现一个网页内同时调用多个倒计时的方法
Apr 27 jQuery
jQuery Ajax 实现分页 kkpager插件实例代码
Aug 10 jQuery
使用jquery+iframe做一个ajax上传效果(实例)
Aug 24 jQuery
jquery实现左右轮播图效果
Sep 28 jQuery
jquery ajaxfileupload异步上传插件
Nov 21 jQuery
jquery 输入框查找关键字并提亮颜色的实例代码
Jan 23 jQuery
jQuery实现滚动到底部时自动加载更多的方法示例
Feb 18 jQuery
jQuery时间戳和日期相互转换操作示例
Dec 07 jQuery
jQuery实现的简单歌词滚动功能示例
Jan 07 jQuery
Jquery实现获取子元素的方法分析
Aug 24 jQuery
jQuery - AJAX load() 实例用法详解
Aug 27 jQuery
jQuery实现checkbox全选功能完整实例
Jul 12 #jQuery
js与jQuery实现获取table中的数据并拼成json字符串操作示例
Jul 12 #jQuery
jQuery实现简单复制json对象和json对象集合操作示例
Jul 09 #jQuery
jQuery插件实现弹性运动完整示例
Jul 07 #jQuery
jQuery实现仿京东防抖动菜单效果示例
Jul 06 #jQuery
基于jQuery使用Ajax动态执行模糊查询功能
Jul 05 #jQuery
jQuery实现炫丽的3d旋转星空效果
Jul 04 #jQuery
You might like
php 变量未定义等错误的解决方法
2011/01/12 PHP
php max_execution_time执行时间问题
2011/07/17 PHP
php 无限级分类,超级简单的无限级分类,支持输出树状图
2014/06/29 PHP
php opendir()列出目录下所有文件的实例代码
2016/10/02 PHP
PHP foreach遍历多维数组实现方式
2016/11/16 PHP
Gambit vs ForZe BO3 第三场 2.13
2021/03/10 DOTA
页面中iframe相互传值传参
2009/12/13 Javascript
Javascript快速排序算法详解
2014/12/03 Javascript
jQuery Ajax调用WCF服务详细教程
2015/03/31 Javascript
jQuery学习笔记之回调函数
2016/08/15 Javascript
EL表达式截取字符串的函数说明
2017/09/22 Javascript
nodejs中密码加密处理操作详解
2018/03/20 NodeJs
基于Vue中使用节流Lodash throttle详解
2019/10/30 Javascript
Vue项目中使用jsonp抓取跨域数据的方法
2019/11/10 Javascript
JavaScript枚举选择jquery插件代码实例
2020/11/17 jQuery
[05:01]3.19DOTA2发布会 我们都是刀塔人
2014/03/25 DOTA
Python使用Pycrypto库进行RSA加密的方法详解
2016/06/06 Python
PHP实现发送和接收JSON请求
2018/06/07 Python
pycharm: 恢复(reset) 误删文件的方法
2018/10/22 Python
解决Python一行输出不显示的问题
2018/12/03 Python
Python自定义一个类实现字典dict功能的方法
2019/01/19 Python
python利用openpyxl拆分多个工作表的工作簿的方法
2019/09/27 Python
关于Python-faker的函数效果一览
2019/11/28 Python
在Python中使用K-Means聚类和PCA主成分分析进行图像压缩
2020/04/10 Python
什么是python的函数体
2020/06/19 Python
python操作微信自动发消息的实现(微信聊天机器人)
2020/07/14 Python
BONIA波尼亚新加坡官网:皮革手袋,鞋类和配件
2016/08/25 全球购物
Linux如何压缩可执行文件
2014/03/27 面试题
医药代表个人求职信范本
2013/12/19 职场文书
体育课课后反思
2014/04/24 职场文书
弄虚作假心得体会
2014/09/10 职场文书
社区党支部公开承诺书
2015/04/29 职场文书
毕业论文致谢信
2015/05/14 职场文书
宇宙与人观后感
2015/06/05 职场文书
简短清晨问候语
2015/11/10 职场文书
大学生创业,为什么都会选择快餐饮?
2019/08/08 职场文书