`

jQuery-对Select的操作集合[终结篇](转)

    博客分类:
  • js
 
阅读更多
转自http://www.cnblogs.com/bynet/archive/2009/11/16/1603769.html



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-ComboSelect插件

    jQuery-ComboSelect还提供了事件处理机制,开发者可以绑定各种事件,如打开、关闭、选择、取消选择等,来响应用户的操作。这使得插件具备良好的可扩展性,可以根据业务需求添加额外的功能或交互效果。 在实际应用中...

    jquery-3.7.0.min.js(jQuery下载)

    jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)...

    jquery.editable-select

    7. **集成和使用**:要在项目中使用 `jquery.editable-select`,需要先引入 jQuery 和插件的 JS/CSS 文件,然后对目标 `&lt;select&gt;` 元素应用插件。通常,这可以通过 jQuery 的 `$(document).ready()` 函数来实现。 8...

    下拉模糊查询jQuery-select

    下拉模糊查询 jQuery-select 下拉模糊查询 jQuery-select 下拉模糊查询 jQuery-select 下拉模糊查询 jQuery-select 下拉模糊查询 jQuery-select 下拉模糊查询 jQuery-select

    jquery.editable-select插件使用案例

    此为jquery.editable-select插件的使用案例,这是一款非常好用的插件,好用之处:既可下拉框选择也可手动输入,而且手动输入还能对下拉框选项进行过滤,而且还可实现一些相关事件,具体请查看官方文档。

    select选择框控件jquery-editable-select支持编辑输入

    3. **自定义样式**:通过引入`jquery.editable-select.css`,你可以轻松调整下拉列表的外观以适应网站的设计风格。 4. **事件处理**:插件提供了丰富的事件接口,如`open`、`close`、`input`等,方便开发者监听和...

    jquery-3.1.1.js和jquery-3.1.1.min.js

    本篇文章将深入探讨jQuery 3.1.1版本的两个核心文件——`jquery-3.1.1.js`和`jquery-3.1.1.min.js`,以及它们在Bootstrap Treeview插件中的应用。 首先,我们来看`jquery-3.1.1.js`,这是未经压缩和未优化的源代码...

    jquery插件jquery-ui-1.8.2.custom.min.js

    《jQuery UI与jQuery插件深度解析——以jquery-ui-1.8.2.custom.min.js为例》 在Web开发领域,jQuery库以其简洁易用的API和强大的功能深受开发者喜爱。而jQuery UI作为jQuery的一个扩展,提供了丰富的用户界面组件...

    jquery-ui-1.8.16.custom.min.js/jquery-ui-1.8.16.custom.css

    这个压缩包包含两个关键文件:`jquery-ui-1.8.16.custom.min.js` 和 `jquery-ui-1.8.16.custom.css`,这些都是jQuery UI的特定版本,即1.8.16。这个版本在当时是一个广泛使用的稳定版本,提供了丰富的功能和组件。 ...

    jquery-1.9.1.js 、jquery-1.9.1.min.js 【官方jquery包 js】

    `jquery-1.9.1.js`是未压缩的源代码版本,便于开发者阅读、调试和学习,而`jquery-1.9.1.min.js`是经过压缩和优化后的版本,体积更小,适用于生产环境,以提高页面加载速度。 jQuery 1.9.1版本是一个重要的里程碑,...

    jquery-multi-check-selectbox.rar

    在“jquery-multi-check-selectbox”这个压缩包中,包含了我们改造后的代码。这个扩展增加了全选按钮,当用户点击“全选”时,所有选项都会被选中;反之,点击“全不选”则会取消所有选中的项。这样的设计极大地提高...

    最新版JQuery-jquery-3.2.1.min.js

    在本文中,我们将深入探讨最新版的jQuery,即`jquery-3.2.1.min.js`,以及该版本中的一些变化。** ### 1. jQuery 3.x 版本概述 jQuery 3.x 系列是继1.x和2.x后的又一重大更新,它主要关注性能优化、API清理以及对...

    jquery-editable-select:一个简单的jQuery插件,可将选择转换为带有建议的文本字段

    jQuery可编辑选择 jQuery Editable Select是一个jQuery...演示版在此处查看演示: : 安装从 , 或获取jQuery Editable Select: npm install jquery-editable-selectbower install jquery-editable-select git clone ...

    jquery-ui-datepicker中文版

    jquery-ui-日期框扩展成时间框 jquery-ui时间框 基于别人的代码进行修改 jquery-ui-1.8.16.custom.css文件末尾加入以下代码 .ui-timepicker-div .ui-widget-header{ margin-bottom: 8px; } .ui-timepicker-div dl{ ...

    jquery-1.11.1.js 、jquery-1.11.1.min.js 【官方jquery包 js】

    这个压缩包包含了两个版本的jQuery——`jquery-1.11.1.js`和`jquery-1.11.1.min.js`,它们都是官方发布的jQuery 1.11.1版本。这两个文件的主要区别在于,前者是未经压缩的源代码版本,方便开发者阅读和调试;后者则...

    最新jquery-2.1.1.js以及jquery-2.1.1.min.js文件

    本次我们关注的是其2.1.1版本,包含了两个主要文件:`jquery-2.1.1.js`和`jquery-2.1.1.min.js`,这两个文件在Web开发中起着至关重要的作用。 `jquery-2.1.1.js`是jQuery库的完整源代码版本,包含了所有功能和方法...

    jquery -- select美化--多级联动下拉

    针对这一问题,jQuery 提供了一种解决方案,即通过插件对 select 进行美化和功能增强,让其更适应各种复杂的交互需求。 标题 "jquery -- select美化--多级联动下拉" 指的是利用 jQuery 插件来实现 Select 的美化和...

    jQuery lou-multi-select-0.9.5 插件

    lou-multi-select 插件基于jQuery构建,因此使用前需确保引入了jQuery库。 2. **多选下拉框增强**:默认的HTML `&lt;select&gt;` 元素只允许单选,而此插件通过JavaScript和CSS将多选下拉框转变为可扩展、可搜索、可分组...

    jquery-2.0.0.js 、jquery-2.0.0.min.js 【官方jquery包 js】

    如`jquery-2.0.0.js`和`jquery-2.0.0.min.js`,后者是经过压缩后的版本,更适合生产环境使用。 - **更好的DOM操作**:jQuery 2.0.0进一步增强了选择器引擎,提升了对CSS3选择器的支持,使得开发者能更方便地选取和...

    jquery-ui.min.js

    在本文中,我们将深入探讨jQuery UI的核心功能,尤其是标题所提及的`jquery-ui.min.js`文件,以及其在实际开发中的应用。 首先,`jquery-ui.min.js`是jQuery UI的压缩和优化版本,用于提高页面加载速度并减少网络...

Global site tag (gtag.js) - Google Analytics