jQuery操作下拉框的text值和val值

jQuery操作下拉框的text值和val值

1,JS源码

<select name="select1" id="select1" style="width:300px;">
  <option value="">-- 请选择 --</option>
    <c:forEach items="${bi_role_list}" var="bi_role"  varStatus="id" >
    <option value="${bi_role.bi_roleid}">${bi_role.bi_rolename}</option>
  </c:forEach>
</select>     

2,jQuery操作

(1)获取当前选中select的text值

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

(2)获取当前选中select的value值

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

(3)获取当前选中select的索引值

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

(4)设置索引值为1的项为当前选中项

$("#select1").get(0).selectedIndex=1; 

(5)设置value值1的项为当前选中项

$("#select1").val(1);

(6)设置text值为"2017"的项为当前选中项

$("#select1 option[text=‘2017‘]").attr("selected",true); 

(7)为指定select下拉框追加一个option(追加到在末尾)

$("#select1").append(""+i+""); 

(8)为制定select下拉框插入一个option(插入到第一个位置)

$("#select1").prepend("请选择"); 

(9)删除select下拉框的最后一个option

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

(10)清空select控件内容

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

(11)添加/删除Select的Option项

$("#select1").append("<option value=‘Value‘>Text</option>"); //为Select追加一个Option(下拉项)

$("#select1").prepend("<option value=‘0‘>请选择</option>"); //为Select插入一个Option(第一个位置)

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

$("#select1 option[index=‘0‘]").remove(); //删除Select中索引值为0的Option(第一个)

$("#select1 option[value=‘3‘]").remove(); //删除Select中Value=‘3‘的Option

$("#select1 option[text=‘4‘]").remove(); //删除Select中Text=‘4‘的Option

原文地址:https://www.cnblogs.com/lizm166/p/10209347.html

时间: 2024-10-12 18:52:04

jQuery操作下拉框的text值和val值的相关文章

Jquery操作下拉框(DropDownList)实现取值赋值

Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('select#sel option:selected').val(); 或者 $('select#sel').find('option:selected').val(); 获取选中项的Text值: $('select#seloption:selected').text(); 或者 $('select#sel

JQuery操作下拉框

转载自下面的链接,很有用的. http://www.cnblogs.com/yrhua/archive/2012/11/04/2753571.html 要实现这种效果: HTML代码 <script src="js/jquery-1.7.2.min.js"></script> <table> <tr> <td> <!--multiple设定下拉框可以多选,size设定下拉框不呈现下拉方式,--> <selec

jquery 获取下拉框值与select text

下面先介绍了很多jquery获取select属性的方法,同时后面的实例我们讲的是jquery 获取下拉框值与select text代码. 下面先介绍了很多jquery获取select属性的方法,同时后面的实例我们讲的是jquery 获取下拉框值与select text代码. jquery获取select选择的文本与值 获取select : 获取select 选中的 text : $("#ddlregtype").find("option:selected").tex

jquery获得下拉框值的代码

jquery获得下拉框值的代码 获取Select : 获取select 选中的 text : $("#ddlRegType").find("option:selected").text(); 获取select选中的 value: $("#ddlRegType ").val(); 获取select选中的索引: $("#ddlRegType ").get(0).selectedIndex; 设置select: 设置select 选

jquery 对下拉框和单选框的一些操作

下拉框 <select id="CategoryId" data-placeholder="资产类型" style="width:350px;" > <option value="1">硬盘</option> <option value="2">主板</option> <option value="3">CPU<

选择下拉框是如何取选项的值?

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>select</title> <script type="text/javascript"> </script> </head> <body id="body&

js,jquery获取下拉框选中的option

js获取select选中的值: var sel=document.getElementById("select1"); var index = sel.selectedIndex; // 选中索引 albumid= sel.options[index].value;//要的值 jQuery获取下拉框选中的option: $("#s option:selected").val();

jQuery切换下拉框里面对应的div

<!DOCTYPE html><html>      <head>            <meta charset="UTF-8">            <title>jquery实现下拉框选中对应的div</title>            <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script

JQuery打造下拉框联动效果

做联动效果,若是用纯JavaScript来做,往往须要辅助页面保存须要刷新的结果集,然后渲染到原页面.考虑将须要动态刷新的内容自己主动拼接到前一个下拉框之后,当前一个下拉框onchange后,同级的后面的下拉框所有清除,然后又一次拼接刷新的内容.用JQuery实现比較easy,代码以省市联动效果为例实现. JSP页面代码例如以下: <li id="base"> <p>生源地:</p> <label> <select id="