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

[转]jquery获得select option的值 和对select option的操作

阅读更多
转自:http://huiyi.yangteng.blog.163.com/blog/static/111209721201122160412/
获取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[i].text == text)  
        {  
            $("#ddlRegType ").get(0).options[i].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();//删除索引值为0的Option
 $("#select_id option[value='3']").remove(); //删除值为3的Option
 $("#select_id option[text='4']").remove(); //删除TEXT值为4的Option



清空 Select:
$("#ddlRegType ").empty();


jquery获得值:
.val()
.text()

设置值
.val('在这里设置值')


$("document").ready(function(){   
	$("#btn1").click(function(){   
		$("[name='checkbox']").attr("checked",'true');//全选   
	})   
	$("#btn2").click(function(){   
		$("[name='checkbox']").removeAttr("checked");//取消全选   
	})   
	$("#btn3").click(function(){   
		$("[name='checkbox']:even").attr("checked",'true');//选中所有奇数   
	})   
	$("#btn4").click(function(){   
		$("[name='checkbox']").each(function(){//反选   
			if($(this).attr("checked")){   
				$(this).removeAttr("checked");   
			}   
			else{   
				$(this).attr("checked",'true');   
			}   
		})   
	})   
	$("#btn5").click(function(){//输出选中的值   
		var str="";   
		$("[name='checkbox'][checked]").each(function(){   
			str+=$(this).val()+"\r\n";   
			//alert($(this).val());   
		})   
		alert(str);   
	})   
}) 
分享到:
评论

相关推荐

    jquery获得select option值

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

    Jquery操作Select option整理

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

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

    综上所述,示例演示了使用jQuery来获取select标签中选中项的值和文本的方法,并考虑了没有value属性的特殊情况,还涉及到了事件绑定和DOM操作的基本知识。对于学习和使用jQuery进行前端开发的读者来说,这些内容都是...

    jquery获得selectoption值[文].pdf

    以下是一些关于如何使用jQuery获取和设置`select`、`option`、`radio`、`checkbox`以及文本输入(`input[type=text]`)等元素的值的关键知识点: 1. **获取选中的`select`值**: ```javascript var item = $(...

    [转]Jquery操作select 收藏

    在IT行业中,jQuery是一个非常流行的JavaScript库,它简化了HTML文档遍历、事件处理、动画制作和Ajax交互等任务。...通过学习这篇博客和提供的文件,开发者可以深化对jQuery操作select的理解,提升开发水平。

    JQuery操作select

    在网页开发中,jQuery 是一个非常流行的 JavaScript 库,它提供了简洁、强大的API来操作DOM元素,包括对select这样的下拉列表的操作。本篇文章将详细讲解如何使用jQuery来操作select。 首先,`changeShipMethod`...

    Jquery获取Select标签的值

    本篇文章将详细介绍如何利用 jQuery 来获取 Select 标签的值以及相关的表单元素操作。 #### 一、获取 Select 标签的值 ##### 1. 获取 Select 的 Value 值 要获取 Select 下拉框的当前选中值(即 value 属性的值)...

    jquery实现select互斥联动

    在网页开发中,jQuery是一个非常流行的JavaScript库,它简化了DOM操作、事件处理以及Ajax交互。在本示例中,我们将探讨如何使用jQuery实现“select”元素的互斥联动效果,这是一种常见的表单控件交互设计,常用于...

    select option带自定义图片

    总结来说,要实现`&lt;select&gt;`和`&lt;option&gt;`带有自定义图片的效果,我们需要结合HTML的`data-*`属性,JavaScript的动态操作和CSS的样式设计。这不仅增强了用户体验,也展示了前端技术在实现视觉效果方面的灵活性。在...

    jQuery获取Select标签的手册

    在jQuery中,对HTML表单元素的操作是相当常见的任务,特别是对于`Select`标签的处理。`Select`标签常用于创建下拉列表,允许用户在多个选项中进行选择。本手册将详细介绍如何使用jQuery获取和操作`Select`标签以及...

    jQuery获取Select选择的Text和_Value

    jQuery 获取 Select 选择的 Text 和 Value 是一种常见的操作,例如在表单提交前获取用户选择的选项,或者在页面加载时根据服务器端的数据设置选择的选项。本文将详细介绍 jQuery 获取和设置 Select 选择的 Text 和 ...

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

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

    jquery select2组件

    在开始使用`Select2`之前,确保已经引入了`jQuery`库和`Select2`的CSS与JS文件。通常情况下,你可以在项目中添加以下链接: ```html &lt;link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-beta.1/dist/css/...

    Jquery操作select标签例子

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作,包括对`&lt;select&gt;`标签的操作。本文将详细讲解如何使用jQuery来管理HTML中的`&lt;select&gt;`元素,包括选择、更改选项,获取选中项的文本、值...

    jquery操作select大全

    以下是一个综合实例,展示了如何使用jQuery监听select元素的变化,并在变化时获取选中的option的文本或值,并对select进行一些基本操作: ```javascript &lt;script src="jquery-1.2.1.js" type="text/javascript"&gt; $...

    jquery根据name取得select选中的值实例(超简单)

    实例如下所示: &lt;select name=region[province] id= class=region valid&gt; &lt;option value=0 selected=selected tier=1&gt;省、直辖...取得textarea的值 &lt;textarea id='address'&gt;&lt;/textarea &gt; $(#textare

    jquery动态添加option

    // 设置option的值和文本 newOption.val("3").text("Option 3"); // 获取id为'mySelect'的select元素 var selectBox = $("#mySelect"); // 将新option添加到select元素的末尾 selectBox.append(newOption); ``` ...

    jquery select 选中值设置左右select选择互换

    总之,jQuery提供的强大API使得我们可以轻松地实现select元素之间的交互操作。通过理解和掌握这些基础知识,你可以构建更加动态和用户友好的Web应用程序。在实际项目中,还可以结合其他库和框架,如Bootstrap的...

    jquery 超级select插件 v4.0版本

    考虑到实际项目中可能面临的浏览器兼容性问题,jQuery超级Select插件v4.0版本致力于兼容主流的现代浏览器,同时也尽可能对旧版浏览器提供支持。此外,它在性能上做了优化,如延迟初始化、虚拟DOM技术等,以确保在大...

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

    总结,通过jQuery,我们可以轻松实现两个`&lt;select&gt;`元素之间`&lt;option&gt;`的转移、全选、单选和删除操作。这大大提高了开发效率,使用户界面更加灵活和友好。在实际项目中,还可以根据需求添加更多的功能和优化,例如,...

Global site tag (gtag.js) - Google Analytics