建站
咨詢
售后
建站咨詢
新聞中心
如何獲取下拉列表選中的值 jquery
分別使用javascript原生的方法和jquery方法
成都網(wǎng)絡公司-成都網(wǎng)站建設公司創(chuàng)新互聯(lián)公司10多年經驗成就非凡，專業(yè)從事做網(wǎng)站、成都網(wǎng)站設計，成都網(wǎng)頁設計，成都網(wǎng)頁制作，軟文發(fā)布平臺，一元廣告等。10多年來已成功提供全面的成都網(wǎng)站建設方案，打造行業(yè)特色的成都網(wǎng)站建設案例，建站熱線：028-86922220，我們期待您的來電！
select id="test" name=""
option value="1"text1/option
option value="2"text2/option
/select
code:
一：javascript原生的方法
1:拿到select對象： var myselect=document.getElementById("test");
2：拿到選中項的索引：var index=myselect.selectedIndex ; // selectedIndex代表的是你所選中項的index
3:拿到選中項options的value： myselect.options[index].value;
4:拿到選中項options的text： myselect.options[index].text;
二：jquery方法（前提是已經加載了jquery庫）
1:var options=$("#test option:selected"); //獲取選中的項
2:alert(options.val()); //拿到選中項的值
3:alert(options.text()); //拿到選中項的文本
jquery怎么設置下拉列表被選中
參考以下兩種方法：
設置option的selected屬性為true
設置select標簽的value值為需要選中的值
實例演示如下:
1、根據(jù)演示需要，給出一個示例HTML結構
select?id="test"
option?value="1"option-1/option
option?value="2"option-2/option
option?value="3"option-3/option
/selectbr
input?type="button"?id="btn1"?value="設置option-2選中"
input?type="button"?id="btn2"?value="設置value=3的項選中"
2、jquery代碼
$(function(){
//?方法1：設置option的selected屬性為true
$("#btn1").click(function()?{??//?第一個按鈕單擊事件
$("select?option").each(function()?{?//?遍歷所有option，如果option內容為option-2，就設置起selected屬性為true
if($(this).text()=="option-2")
$(this).prop("selected",true);
});
});
//?方法2：設置select標簽的value值為需要選中的值
$("#btn2").click(function()?{?//?第二個按鈕的單擊事件
$("select").val("3");??//?設置option值為3的選項選中
});
});
3、效果演示
用jquery怎么判斷下拉框選中的值
參考如下代碼
$("select").val();??//?選中項目的value值
$("select?option:checked").text();?//?選中項目的顯示值
示例如下：
1.創(chuàng)建Html元素
請選擇：
select?id="sel"
option?value="1"選項1/option
option?value="2"選項2/option
option?value="3"選項3/option
option?value="4"選項4/option
/select
input?type="button"?value="點擊查看被選項目"
2.編寫jquery代碼
$(function(){
$("input").click(function()?{
a?=?$("#sel").val();
b?=?$("#sel?option:checked").text();
alert("被選項目的值："+a+"，被選項目的顯示值："+b+"。");
});
})
3.顯示效果
分享名稱：jquery下拉選中,jquery下拉框默認選中
分享地址：http://www.dlmjj.cn/article/dseeeje.html
