`
zjx2388
  • 浏览: 1333947 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

jQuery的Select操作集合

 
阅读更多

jQuery获取Select选择的Text和Value:
语法解释:
1. $("#select_id").change(function(){//code...});    //为Select添加事件,当选择其中一项时触发
2. var checkText=$("#select_id").find("option:selected").text();   //获取Select选择的Text
3. var checkValue=$("#select_id").val();   //获取Select选择的Value
4. var checkIndex=$("#select_id ").get(0).selectedIndex;   //获取Select选择的索引值
5. var maxIndex=$("#select_id option:last").attr("index");   //获取Select最大的索引值

 

jQuery设置Select选择的Text和Value:
语法解释:
1. $("#select_id ").get(0).selectedIndex=1;   //设置Select索引值为1的项选中
2. $("#select_id ").val(4);    //设置Select的Value值为4的项选中
3. $("#select_id option[text='jQuery']").attr("selected", true);    //设置Select的Text值为jQuery的项选中

 

 

jQuery添加/删除Select的Option项:
语法解释:
1. $("#select_id").append("<option value='Value'>Text</option>");   //为Select追加一个Option(下拉项)
2. $("#select_id").prepend("<option value='0'>请选择</option>");   //为Select插入一个Option(第一个位置)
3. $("#select_id option:last").remove();   //删除Select中索引值最大Option(最后一个)
4. $("#select_id option[index='0']").remove();   //删除Select中索引值为0的Option(第一个)
5. $("#select_id option[value='3']").remove();   //删除Select中Value='3'的Option
5. $("#select_id option[text='4']").remove();   //删除Select中Text='4'的Option

分享到:
评论

相关推荐

    Jquery Select操作方法集合脚本之家特别版

    ### Jquery Select操作方法集合脚本之家特别版 在网页开发过程中,经常需要用到对`&lt;select&gt;`元素的操作,包括但不限于获取或设置选中的值、添加或删除选项等。本文将详细介绍如何利用jQuery来高效地完成这些操作。 ...

    jQuery对Select的操作大集合(收藏)

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作,包括对Select元素的处理。Select元素是HTML中用于创建下拉列表的标签,通常用于提供多个选项供用户选择。本文将深入探讨jQuery如何操作...

    jquery select

    使用jQuery Select可以实现各种常见的DOM操作,例如改变元素的样式、内容,添加或移除类,响应用户交互,以及实现动画效果。在实际项目中,结合jQuery的其他方法,如`.on()`(绑定事件)、`.addClass()`(添加类)...

    jquery 动态遍历select 赋值的实例

    这是一个非常有用的jQuery方法,可以移除集合中所有匹配元素的子节点,从而确保在添加新的option之前select列表是空的。 以上就是这篇关于"jquery动态遍历select赋值的实例"中涉及的主要知识点。通过本文的介绍和...

    Jquery 操作 Dom 标签 select

    ### Jquery 操作 Dom 标签 Select 在前端开发中,使用 jQuery 操作 DOM 元素是非常常见的需求之一。特别是对于表单元素如 `select`、`radio` 和 `checkbox` 的操作,更是频繁出现。下面我们将详细介绍如何使用 ...

    Jquery特效插件集合

    jQuery是一款广泛应用于Web开发的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画设计和Ajax交互。"Jquery特效插件集合"显然是一份包含多种jQuery特效插件的资源包,对于Web开发者来说,这些插件...

    jQuery select双向选择菜单.zip

    本项目“jQuery select双向选择菜单”是基于jQuery实现的一种交互式UI组件,主要用于提高用户在网页上的选择体验。它允许用户在两个关联的选择菜单之间进行双向同步操作,即用户在一个菜单中选择项时,相关联的菜单...

    jquery_select

    在不使用jQuery的情况下,处理`&lt;select&gt;`元素可能涉及到复杂的DOM操作和事件监听。但借助jQuery,这些任务变得简单而直观。 jQuery中的`select`选择器允许我们轻松地选取页面上的`&lt;select&gt;`元素。例如,如果我们有...

    多年收集的 JavaScript、jQuery 插件、UI 集合,值得温故知新的前端学习旅程

    5. **闰年下拉选框-生日.html**:这可能是创建一个包含闰年选项的日期选择器,可能用到了HTML的`&lt;select&gt;`元素,结合jQuery来动态生成和更新选项,同时考虑闰年的判断逻辑。 6. **倒计时.html**:倒计时功能是...

    jQuery jsTree大集合

    **jQuery jsTree大集合** **一、jQuery与jsTree简介** jQuery是一个轻量级的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画设计以及Ajax交互。它的API设计直观易用,使得开发者能够更高效地...

    jQuery插件集合

    这个"jQuery插件集合"显然包含了多种用于增强和扩展jQuery功能的插件,使得开发者可以更轻松地实现复杂的功能,提升用户体验,且无需从零开始编写大量代码。 1. **DOM操作插件**: - jQuery插件如`jQuery Select2`...

    海量经典的jQuery插件集合

    ### 海量经典的jQuery插件集合 #### 引言 jQuery作为一款优秀的JavaScript库,以其简单易用的特点深受开发者喜爱。随着社区的发展壮大,出现了大量的jQuery插件来满足不同的开发需求。本文将对一系列经典的jQuery...

    JQuery、C#两种操作ListBox的方法

    本篇文章将深入探讨如何使用JQuery和C#这两种不同的技术来操作ListBox。 首先,我们来了解一下JQuery。JQuery是一个强大的JavaScript库,简化了DOM操作、事件处理和Ajax交互。对于ListBox,JQuery提供了方便的方法...

    jquery可选择条件筛选框

    虽然C#主要作为后台语言处理业务逻辑和数据库操作,但可以通过AJAX技术(基于jQuery)实现实时的前端交互,无需刷新整个页面。当用户在筛选框中选择条件时,jQuery可以捕获这些事件,然后通过AJAX发送请求到C#编写的...

    jQuery常见开发技巧详细整理

    同时,事件处理(如`click()`, `blur()`, `focus()`, `select()`, `submit()`)也可以直接应用于jQuery集合,会为每个匹配元素绑定事件处理函数。 6. **链式操作**:jQuery的一大特性是链式操作,允许连续调用多个...

    JQuery操作Select的Options的Bug(IE8兼容性视图模式)

    新的`InitSelectOptions`函数首先使用JQuery的`.empty()`方法清空Select元素,然后通过JavaScript创建新的Option元素,并使用`.add()`方法将它们添加到Select的`options`集合中。这种做法避免了JQuery对DOM操作的...

Global site tag (gtag.js) - Google Analytics