`

JQuery 的select处理 (琐碎)

阅读更多

今天因为需求 需要改动一些页面显示,其中之一是修改积分政策发布政策来源的 下拉框显示。
目前需求是:公司登录的话政策来源下拉框只显示公司和厂商
4s店登录的话政策来源下拉框只显示店面的(设置成只读)
这里牵扯到 jquery 对select处理的方法。
//根据帐号的部门级别设置来源输入状态
function setSource(){
if(accountDto.orgLevel!=1){//显示的是4s店登录
$('#source').attr("disabled",true);
$('#source').val(2);
}
else{//下面显示的是公司登录
$("#source option[value='2']").remove();
//$("#source option[text='店面']").remove();
}
}

$('#source').attr("disabled",true);
$('#source').val(2);

上面这两句意思 是先设置成不可编辑或触发状态,第二句将下拉框的value值显示设置成2这样只显示店面

$("#source option[value='2']").remove();

作用是将 下拉框value值为2清除掉 只保存了公司 和厂商的显示

这个方法在ie6,ff,google的浏览器测试ok

但是$("#source option[text='店面']").remove(); 在ie6 ok,但在ff,google浏览器测试不通过(目前没有研究过why)



下面是一些jquery的select常用方法:

jquery 获取和设置 select下拉框的值(转)

获取select 选中的 text :

$("#ddlRegType").find("option:selected").text();

获取select选中的 value:

$("#ddlRegType ").val();

获取select选中的索引:

$("#ddlRegType ").get(0).selectedIndex;

设置select:

设置select 选中的索引:

$("#ddlRegType ").get(0).selectedIndex=index;//index为索引值

设置select 选中的value

$("#ddlRegType ").attr("value","Normal“);

$("#ddlRegType ").val("Normal");

$("#ddlRegType ").get(0).value = value;

设置select 选中的text:

var count=$("#ddlRegType option").length;

for(var i=0;i<count;i++)

{ if($("#ddlRegType ").get(0).options.text == text)

{

$("#ddlRegType ").get(0).options.selected = true;


break;

}

}

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

设置select option:(个人感觉比较常用)

$("#select_id").append("<option value='Value'>Text</option>");//添加一项option

$("#select_id").prepend("<option value='0'>请选择</option>"); //在前面插入一项option

$("#select_id option:last").remove(); //删除索引值最大的Option

$("#select_id option[index='0']").remove();//删除索引值为0Option

$("#select_id option[value='3']").remove(); //删除值为3Option
ok
没问题

ie6
ff
google

$("#select_id option[text='4']").remove(); //删除TEXT值为4Option
ie6
ok
ff
google
有问题

清空 Select:

 

$("#ddlRegType ").empty();

分享到:
评论

相关推荐

    jquery select2组件

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

    jquery select2

    5. **数据源多样化**:Select2不仅可以绑定到静态的HTML `&lt;option&gt;` 元素,还可以从Ajax请求、JavaScript数组或任何能返回数据的函数中获取选项,这为动态加载和异步数据处理提供了便利。 二、使用方法与示例 1. *...

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

    jQuery是一个广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax交互等任务。在这个案例中,我们使用的是jQuery的select插件,具体来说是"jquery.searchableSelect",它为标准的HTML `&lt;select&gt;`...

    jquery模拟select效果实现

    在网页开发中,jQuery是一个非常流行的JavaScript库,它简化了DOM操作、事件处理以及动画制作等任务。在某些情况下,由于设计或交互需求,我们可能需要对原生的HTML元素进行自定义,例如模拟select下拉菜单的效果。...

    jQuery select下拉框美化代码.zip

    首先,`jQuery` 是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画以及Ajax交互等任务。在这个项目中,`jquery.1.10.2.min.js` 是基础,它提供了用于实现下拉框美化所需的各种功能和方法。 美化HTML...

    jquery select日历选择器点击select框弹出日期选择器

    jquery select日历选择器点击select框弹出日期选择器 jquery select日历选择器点击select框弹出日期选择器 jquery select日历选择器点击select框弹出日期选择器 jquery select日历选择器点击select框弹出日期选择器

    jQuery Select下拉框美化特效.zip

    该特效主要基于JavaScript库jQuery实现,jQuery是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画制作以及Ajax交互等任务。通过jQuery,开发者可以快速地为网站添加各种动态效果和交互功能。 这个...

    jQuery Select(单选) 模拟插件 V1.3.6

    这个插件的实现原理主要是通过jQuery对原生`&lt;select&gt;`元素进行包装,使用HTML和CSS构建一个新的可视元素来模拟选择器的外观,再通过JavaScript处理用户交互,如点击、滑动等,实时同步`&lt;select&gt;`元素的状态,确保...

    jquery select列表选择框选中美化效果源码

    在IT行业中,jQuery库是广泛使用的JavaScript库,它极大地简化了DOM操作、事件处理和动画效果。本主题聚焦于“jquery select列表选择框选中美化效果源码”,这是一个关于利用jQuery来增强HTML `&lt;select&gt;` 元素外观和...

    jquery实现select互斥联动

    综上所述,jQuery实现的select互斥联动是一种常见的前端交互设计,通过监听和处理事件,动态调整下拉列表的选项,以满足不同场景下的用户需求。在理解基本原理后,可以根据具体项目需求进行扩展和优化。

    select2(jquery)插件下载

    **jQuery Select2插件详解** Select2是一款基于jQuery的增强型下拉选择框插件,它极大地改进了原生HTML `&lt;select&gt;` 元素的用户体验和功能。标题中的"select2(jquery)插件下载"指的是这个插件的获取途径,通常通过...

    jquery select 多种下拉日期选择插件

    在IT领域,jQuery是一款广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax交互。本文将深入探讨“jQuery select 多种下拉日期选择插件”的相关知识点,帮助开发者理解和应用此类插件。 首先,...

    jquery select美化插件

    在IT行业中,前端开发往往需要处理用户界面的美观与交互性,其中下拉选择框(select)是常见的元素之一。然而,原生的HTML `&lt;select&gt;` 标签在样式控制和用户体验方面存在局限,不能满足现代网页设计的需求。这就催生...

    jquery.selectbox.js select下拉菜单美化代码

    jquery.selectbox.js select下拉菜单美化代码 jquery.selectbox.js select下拉菜单美化代码 jquery.selectbox.js select下拉菜单美化代码

    jquery select表单提交省市区城市三级联动

    jquery select表单提交省市区城市三级联动 jquery select表单提交省市区城市三级联动 jquery select表单提交省市区城市三级联动 jquery select表单提交省市区城市三级联动

    jQuery实现select样式美化 jQselect.js

    通过jQuery,开发者可以编写更简洁、高效的代码来处理DOM操作,这使得对`&lt;select&gt;`的美化变得更加容易。 jQselect.js这个脚本就是针对`&lt;select&gt;`元素的美化插件,它能够将标准的下拉选择框转换为具有自定义样式的...

    [转]Jquery操作select 收藏

    总的来说,掌握jQuery操作select的方法对于前端开发来说是非常实用的技能,它能够提高代码的效率和可读性,同时为用户带来更好的交互体验。通过学习这篇博客和提供的文件,开发者可以深化对jQuery操作select的理解,...

    jquery 超级select插件 v4.0版本

    《jQuery超级Select插件v4.0版本详解》 在Web开发中,下拉选择框(Select)是最常见的表单元素之一,但在某些场景下,普通的Select可能无法满足复杂的交互需求,例如多选、搜索过滤、自定义样式等。这时,jQuery...

    jQuery手机下拉框select

    `jQuery手机下拉框select` 主要关注于改善移动端的用户体验,通过JavaScript和CSS增强下拉框的外观和功能。 ### jQuery Mobile Select Menu jQuery Mobile 提供了一个专门的 Select Menu 插件,用于将标准的...

    80、jquery select下拉框美化代码

    1. **jQuery Select Plugins**: - **Chosen**:Chosen是一个流行的jQuery插件,它提供了可搜索、可选择的多选下拉框,具有良好的用户体验。通过简单的配置,可以轻松地将普通的select元素转换为美观的下拉框。 - ...

Global site tag (gtag.js) - Google Analytics