`
frank1998819
  • 浏览: 758240 次
  • 性别: Icon_minigender_1
  • 来自: 南京
文章分类
社区版块
存档分类

jQuery 增加 删除 修改select option (转)

阅读更多
jQuery获取Select选择的Text和Value:

      1. var checkText=jQuery("#select_id").find("option:selected").text();   //获取Select选择的Text

      2. var checkValue=jQuery("#select_id").val();   //获取Select选择的option Value

      3. var checkIndex=jQuery("#select_id ").get(0).selectedIndex;   //获取Select选择的索引值

      4. var maxIndex=jQuery("#select_id option:last").attr("index");   //获取Select最大的索引值

jQuery添加/删除Select的Option项:

      1. jQuery("#select_id").append("<option value='Value'>Text</option>");   //为Select追加一个Option(下拉项)

      2. jQuery("#select_id").prepend("<option value='0'>请选择</option>");   //为Select插入一个Option(第一个位置)

      3. jQuery("#select_id option:last").remove();   //删除Select中索引值最大Option(最后一个)

      4. jQuery("#select_id option[index='0']").remove();   //删除Select中索引值为0的Option(第一个)

      5. jQuery("#select_id option[value='3']").remove();   //删除Select中Value='3'的Option

      6. jQuery("#select_id option[text='4']").remove();   //删除Select中Text='4'的Option

内容清空:

      jQuery("#select_id").empty();
分享到:
评论

相关推荐

    Jquery操作Select option整理

    ### jQuery 操作 Select Option 整理 #### 一、引言 在Web开发中,`&lt;select&gt;`元素作为用户交互的重要部分,常用于提供一系列选项供用户选择。jQuery作为一种流行的JavaScript库,极大地简化了DOM操作的过程,使得...

    用jquery获取select标签中选中的option值及文本的示例

    根据提供的文件信息,我们可以了解到如何使用jQuery来获取HTML中select标签的选中项(option)的值(value)和文本内容(text)。以下是详细的知识点: 1. 引入jQuery库:要使用jQuery操作DOM元素,必须先引入...

    JQuery中对Select的option项的添加、删除、取值

    jQuery获取Select选择的Text和Value: 代码如下: $(“#select_id”).change(function(){//code…}); //为Select添加事件,当选择其中一项时触发 var checkText=$(“#select_id”).find(“option:selected”).text(); ...

    jQuery增加、删除及修改select option的方法

    #### 增加、删除、修改select中的option项 1. **向select中追加一个option**: ```javascript $('#select_id').append("&lt;option value='Value'&gt;Text&lt;/option&gt;"); ``` 此代码会在select元素的底部增加一个新的...

    jquery获得select option值

    根据提供的文件信息,我们可以总结出一系列关于如何使用jQuery来获取不同类型的表单元素(如文本框、单选按钮、复选框以及下拉列表)的值的方法。下面将详细介绍这些方法及其应用场景。 ### 一、获取文本框(input ...

    select option带自定义图片

    首先,修改`&lt;option&gt;`元素,添加`data-*`属性: ```html &lt;select id="customSelect"&gt; &lt;option value="option1" data-image-url="img/option1.jpg"&gt;Option 1&lt;/option&gt; &lt;option value="option2" data-image-url=...

    jquery实现 两个select之间option的转移操作

    本文将深入探讨如何使用jQuery实现两个`&lt;select&gt;`元素之间的`&lt;option&gt;`选项转移操作,包括全选、单选以及删除功能。 首先,我们需要了解`&lt;select&gt;`和`&lt;option&gt;`的基本概念。`&lt;select&gt;`元素用于创建下拉列表,而`...

    jquery实现select互斥联动

    为每个`select`元素添加`change`事件监听器,当用户更改选项时触发相应函数。 3. 逻辑处理:在`change`事件的回调函数中,获取当前选中的值,并根据预设的联动规则更新其他`select`元素的选项。这可能涉及清除某些...

    Jquery combo-select

    《jQuery Combo-Select:构建高效的下拉选择器》 在Web开发中,jQuery库因其简洁易用的API和丰富的插件生态,深受开发者喜爱。其中,"jQuery combo-select"是一种常见的交互元素,它将传统的下拉选择器(select)与...

    jquery下拉菜单插件SelectMenu

    **jQuery下拉菜单插件SelectMenu详解** 在网页开发中,下拉菜单是常见的交互元素,用于提供多种选择项供用户进行操作。`SelectMenu.js` 是一款基于 jQuery 的高效下拉菜单插件,它提供了丰富的特性,使开发者能够...

    jquery select2组件

    **jQuery Select2组件详解** `jQuery Select2`是一款强大的、高度可定制的下拉选择框插件,它在原生HTML `&lt;select&gt;` 元素的基础上提供了丰富的功能和优秀的用户体验。这款组件广泛应用于网页开发中,使得传统的单选...

    JQuery操作select

    例如,`$("#selectTest").change(function() {...})`会在用户更改`selectTest`的选项时触发内部的代码,如显示选中项的文本或修改select的值。 总的来说,jQuery使得在JavaScript中处理select和其他HTML元素变得...

    jQuery多选下拉框插件

    在深入理解`jquery.multi-select.js`之前,我们先简要回顾一下jQuery库。jQuery是由John Resig创建的一个轻量级、高性能的JavaScript库,它简化了DOM操作、事件处理、动画以及Ajax交互。jQuery的核心特性包括选择器...

    jQuery手机下拉框select

    - **`.selectmenu('refresh')`方法**:当DOM元素被动态添加或修改后,调用此方法可以重新渲染Select Menu。 ### 示例代码 ```html &lt;select id="mySelect" data-role="select"&gt; &lt;option value="option1"&gt;Option 1...

    jquery 封装select实现select自定义样式插件jquery.easydropdown.min.js

    《jQuery封装Select实现自定义样式插件:jquery.easydropdown.min.js》 在Web开发中,Select元素是常用的数据选择控件,但其默认样式通常较为单一,无法满足设计师们对界面美观度的需求。jQuery库为我们提供了丰富...

    select通过js删除指定的option选项

    简单的例子,点击按钮就删除掉option,也可以通过jquery加载的时候进行删除。

    [转]Jquery操作select 收藏

    这篇博客 "[转]Jquery操作select 收藏" 可能是博主分享的一个关于如何使用jQuery高效地操作HTML中的&lt;select&gt;元素的教程。在网页设计中,select元素常用于创建下拉菜单,让用户从预设的选项中选择一个或多个值。 ...

    jquery select插件带搜索框的下拉选择框代码

    在本文中,我们将深入探讨如何使用jQuery的"searchableSelect"插件来创建一个具有搜索功能的下拉选择框。这个插件对于那些需要在大量选项中快速查找和选择的项目非常有用,它大大提升了用户体验。 首先,让我们了解...

    可编辑的select下拉框

    安装`jQuery Editable Select`插件非常简单,首先需要在项目中引入jQuery库,然后下载`jquery-editable-select`压缩包。在这个名为`jquery-editable-select-master`的压缩包中,通常包含以下文件: 1. `dist/`目录...

Global site tag (gtag.js) - Google Analytics