JavaScript与jQuery获取Select选中值的完整方法

作者:纸飞机时间:2026-10-30 08:12:41浏览:541

本文详细讲解如何在JavaScript原生环境和jQuery库中获取Select下拉菜单的选中值、文本内容及索引。涵盖通过getElementById定位元素、操作options数组,以及使用jQuery选择器如:selected伪类和find方法实现快速取值,适用于前端开发中的表单数据处理场景。

JavaScript原生方法获取Select值

代码如下:

var obj = document.getElementById("testSelect"); //定位id
var index = obj.selectedIndex; // 选中索引
var text = obj.options[index].text; // 选中文本
var value = obj.options[index].value; // 选中值

jQuery获取Select值的两种实现方式

使用jQuery获取选中select的值

第一种方式

代码如下:

$('#testSelect option:selected').text();//选中的文本
$('#testSelect option:selected').val();//选中的值
$("#testSelect").get(0).selectedIndex;//索引

第二种方式

代码如下:

$("#tesetSelect").find("option:selected").text();//选中的文本
$("#tesetSelect").find("option:selected").val();
$("#tesetSelect").find("option:selected").get(0).selectedIndex;

以上介绍了JavaScript获取select标签选中值的全部内容,希望能给大家一个参考,也希望大家多多支持本站。

作者最新文章