当前位置: 首页 > 编程笔记 >

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

邢寒
2023-03-14
本文向大家介绍jQuery实现监听下拉框选中内容发生改变操作示例,包括了jQuery实现监听下拉框选中内容发生改变操作示例的使用技巧和注意事项,需要的朋友参考一下

本文实例讲述了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常用插件及用法总结》、《jQuery操作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》

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

 类似资料:
  • 本文向大家介绍android输入框内容改变的监听事件实例,包括了android输入框内容改变的监听事件实例的使用技巧和注意事项,需要的朋友参考一下 android输入框内容改变的监听事件一般用于比如我们常见的:登录qq时 用户名输入完整时头像自动显示,或者注册用户时实时提示注册格式是否正确等。那么我们在这里举例:判断输入框是否有内容,来改变按钮的状态,常用于搜索一类。截图如下:(布局代码不再给出)

  • 本文向大家介绍vue 监听 Treeselect 选择项的改变操作,包括了vue 监听 Treeselect 选择项的改变操作的使用技巧和注意事项,需要的朋友参考一下 项目中使用 Treeselect 时,需要获取选项的变化从而触发别的事件,所以需要监听Treeselect 所选择的值。 我使用了watch 来监听 treeselect 绑定的 model ,如果 model 的值发生变化就触发

  • 本文向大家介绍vue.js实现单选框、复选框和下拉框示例,包括了vue.js实现单选框、复选框和下拉框示例的使用技巧和注意事项,需要的朋友参考一下 Vue.js可以很方便的实现数据双向绑定,所以在处理表单,人机交互方面具有很大的优势。下边以单选框、复选框和下拉框为例介绍他们在HTML和Vue.js中的具体实现方式。 一、单选框   在传统的HTML中实现单选框的方法如下: 注:这里name属性值必

  • 本文向大家介绍jQuery实现下拉框选择图片功能实例,包括了jQuery实现下拉框选择图片功能实例的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了jQuery实现下拉框选择图片功能。分享给大家供大家参考。具体如下: 让下拉框中显示图片,并可选择对应图片,让select下拉框不仅可显示文字,还可以显示图片内容。为了更生动些,这里还加入了jQuery动画效果,当展开Select列表的时候,图片

  • 本文向大家介绍jquery实现下拉框多选方法介绍,包括了jquery实现下拉框多选方法介绍的使用技巧和注意事项,需要的朋友参考一下 一、说明 本文是利用EasyUI实现下拉框多选功能,在ComboxTree其原有的基础上对样式进行了改进,样式表已上传demo,代码如下 二、代码 三、效果 四、下载   案例下载:http://wd.jb51.net:81//201701/yuanma/ComboB

  • 本文向大家介绍jQuery Select下拉框操作小结(推荐),包括了jQuery Select下拉框操作小结(推荐)的使用技巧和注意事项,需要的朋友参考一下 jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 2. var check

  • 本文向大家介绍JQuery select(下拉框)操作方法汇总,包括了JQuery select(下拉框)操作方法汇总的使用技巧和注意事项,需要的朋友参考一下 1. 获取选中项: 获取选中项的Value值: 或者 获取选中项的Text值: 或者 2.   获取当前选中项的索引值: 3.   获取当前option的最大索引值: 4.   获取DropdownList的长度: 或者 5.  设置第一个

  • 主要内容:本节引言:,1.监听EditText的内容变化,2.实现EditText的密码可见与不可见,本节小结:本节引言: 在前面我们已经学过EditText控件了,本节来说下如何监听输入框的内容变化! 这个再实际开发中非常实用,另外,附带着说下如何实现EditText的密码可见 与不可见!好了,开始本节内容! 1.监听EditText的内容变化 由题可知,是基于监听的事件处理机制,好像前面的点击事件是OnClickListener,文本内容 变化的监听器则是:TextWatcher,我们可以调