`
chembo
  • 浏览: 940946 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

jquery操 select

阅读更多
一、 获取select中选择的text与value相关的值

获取select选择的Text : var checkText=$("#slc1").find("option:selected").text();

获取select选择的value:var checkValue=$("#slc1").val();

获取select选择的索引值: var checkIndex=$("#slc1 ").get(0).selectedIndex;

获取select最大的索引值: var maxIndex=$("#slc1 option:last").attr("index");

二、  设置select选择的Text和Value

设置select索引值为1的项选中:$("#slc1 ").get(0).selectedIndex=1; 

设置select的value值为4的项选中: $("#slc1 ").val(4); 

设置select的Text值为JQuery的选中:

$("#slc1 option[text='jQuery']").attr("selected", true);

PS:特别要注意一下第三项的使用哦。看看JQuery的选择器功能是如此地强大呀!

三、 添加删除option项

为select追加一个Option(下拉项)

$("#slc2").append("<option value='"+i+"'>"+i+"</option>");

为select插入一个option(第一个位置)

$("#slc2").prepend("<option value='0'>请选择</option>");

PS: prepend 这是向所有匹配元素内部的开始处插入内容的最佳方式。

删除select中索引值最大option(最后一个)

$("#slc2 option:last").remove();

删除select中索引值为0的option(第一个)

$("#slc2 option[index='0']").remove();

删除select中value=’3’的option

$("#slc2 option[value='3']").remove();

删除select中text=’4’的option

$("#slc2 option[text='3']").remove();
分享到:
评论

相关推荐

    jQuery黑白两种响应式手机下拉框select

    总结起来,jQuery黑白两种响应式手机下拉框select的实现涉及到响应式设计原则、自定义CSS样式以及利用jQuery进行事件处理和DOM操作。这个过程不仅提升了用户体验,也展示了jQuery在增强网页交互性方面的强大能力。

    jQuery Select下拉框美化代码

    本资源"jQuery Select下拉框美化代码"提供了一种方法来改进传统下拉框的外观,使其更具吸引力。以下是这个美化代码的核心知识点: 1. **jQuery库**:jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件...

    Jquery实现的角色左右选择特效

    【jQuery实现的角色左右选择特效】是一种交互式的用户界面设计,常用于权限管理或者角色分配的场景,让用户能够方便地在两个列表之间转移选项。在这个特效中,有两个`&lt;select&gt;`元素,一个代表左侧可供选择的角色,另...

    jquery表格插件及JavaScript选择框

    jQuery是一个流行的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互。在本案例中,我们将探讨如何使用jQuery插件Datatables来改进表格,并结合JavaScript的选择框技术提升用户体验。 Datatables是一...

    jQuery带搜索筛选功能的下拉框美化插件.zip

    《jQuery带搜索筛选功能的下拉框美化插件详解》 在网页开发中,下拉框(Dropdown)是常见的交互元素,它能有效地节省空间,提供多种选择。然而,随着选项数量的增加,用户查找所需项变得困难。为了解决这个问题,...

    修改一个jquery实现的带时间的日历

    标题 "修改一个jQuery实现的带时间的日历" 涉及到的是在Web开发中使用JavaScript库jQuery创建一个具有时间功能的日历插件。这个日历不仅显示日期,还允许用户选择具体的时间,增强了用户体验。下面我们将深入探讨...

    JQuery UI 中文帮助文档

    同时,通过绑定事件处理函数,如 `$(element).on('select', function() {...})`,可以响应用户交互。 **3. jQuery UI 主题** jQuery UI 的一个重要特点是其强大的主题系统,通过 ThemeRoller 工具,开发者可以...

    jQuery-Placeholder:在所有浏览器中支持 HTML5 占位符属性的简单 jQuery 插件

    jQuery 占位符支持 HTML5 占位符属性的简单 jQuery 插件。怎么做: 首先下载jquery.placeholder.js和jquery.js然后将这些... // Select all inputs and textarea 如果浏览器支持 HTML5 占位符属性,则插件不执行任何操

    一个基于jQuery 实现的的全选、反选复选框插件源码例子

    $('#selectAll').on('click', function() { if ($(this).is(':checked')) { $('input[type="checkbox"]').prop('checked', true); } else { $('input[type="checkbox"]').prop('checked', false); } }); ``` ...

    jQuery表单美化实例代码

    本文将深入探讨jQuery如何实现表单美化,以及如何对input输入框、select下拉框、复选框和单选框进行样式定制。 一、jQuery表单美化基础 jQuery通过选择器和方法可以方便地操控DOM元素,实现对表单元素的动态操作。...

    jQuery中操控hidden、disable等无值属性的方法

    对于`disabled`属性,当需要禁用一个表单元素(如input或select元素)时,同样推荐使用`.prop()`方法。`.prop()`方法不仅能设置`disabled`属性,还能返回一个布尔值,表明元素是否被禁用。这种方法比`.attr()`更适合...

    jquery 根据name名获取元素的value值

    此外,如果你需要处理的不仅仅是`input`元素,也可以调整选择器来适应其他类型的元素,例如`select`或`textarea`。 总的来说,理解jQuery的选择器和属性访问是提高Web开发效率的关键技能。通过熟悉这些基本操作,你...

    jQuery自定义下拉框特效代码

    2. 自定义样式:传统的HTML下拉框(`&lt;select&gt;`元素)样式受限,难以进行美化。利用jQuery,我们可以创建自定义的HTML结构,如使用`&lt;ul&gt;`和`&lt;li&gt;`来模拟下拉框,并应用CSS进行美化,提供更丰富的视觉效果。 二、...

    multi-select:用于多选 https 的 Shim 存储库

    3. **jQuery插件**:`jquery.multi-select.js`是jQuery的一个插件,扩展了原生&lt;select&gt;元素的功能,使其具备多选特性。 4. **Shim**:在不支持新特性的浏览器中,Shim用于模拟新特性,确保代码兼容性。 5. **HTTPS...

    jQuery酷炫黑色下拉框选择特效代码

    下拉框选择特效的核心在于将传统的HTML `&lt;select&gt;` 元素升级为一个具有高级功能的组件。这个组件通常由两个主要部分组成:一个可点击的触发按钮和一个展开的选项列表。当用户点击触发按钮时,选项列表会以酷炫的动画...

    jQuery表单域选择器用法分析

    jQuery表单域选择器是jQuery库中用于选取HTML表单元素的强大工具,它们简化了对输入字段、文本区域、选择列表、按钮等的处理。下面将详细介绍这些选择器的用法和功能。 1. `:input`选择器:这个选择器用于选取所有...

    JQ 获取内容和属性

    3. **`val()`**: 对于表单元素,如`&lt;input&gt;`、`&lt;textarea&gt;`或`&lt;select&gt;`,`val()`方法用于获取或设置它们的值。 ```javascript var inputValue = $('input[type="text"]').val(); ``` ### 获取属性 1. **`attr...

    EXTJS资料文档

    它的工作原理类似于jQuery的`$(selector)`,通过传入一个CSS选择器,`Ext.select()`能够返回匹配该选择器的所有元素的数组。这些元素可以是EXTJS组件,也可以是普通的HTML元素。在EXTJS中,你可以利用这个方法来操控...

    几个经典JavaScript控件

    - 在JavaScript中,选择控件通常指的是下拉列表(`&lt;select&gt;` 元素)。通过JavaScript,我们可以动态添加、删除选项,改变选中状态,甚至实现多选功能。`jQuery UI` 提供了可自定义的下拉选择器,如`Autocomplete`,...

Global site tag (gtag.js) - Google Analytics