在表单提交的网页中，我们经常使用下拉菜单列表，这篇文章解释了如何获取下拉列表选择的值。在jQuery中，我们通过使用.val()方法获得下拉列表的选定值。 .val()方法主要用于获取表单元素的值，例如input，select和textarea。

描述：获取匹配元素集中第一个元素的当前值。

jQuery获取下拉菜单列表选定值

下面是实例分析。

引用jQuery库文件

在HTML代码前面需要引用jQuery库文件，你可以把jQuery库文件下载到本地服务器进行调用，也可以直接使用第三方提供的公共库文件，这里推荐使用百度的jQuery库文件。

<head>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>

HTML

这里我们有一个select下拉列表控件和一个button按钮标签，所以我们的HTML如下所示：

<select id="myDlist">
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
<option value="4">four</option>
</select>
<button id="btn">Click me</button>

jQuery

这里使用.val()方法，我们得到下拉列表选定值。

代码1：

$('#myDlist option:selected').val();

代码2：

$('#myDlist').val();

上面两种代码都可以获得下拉菜单列表的选定值，不过第2种方法更加简洁。

完整的HTML代码

<html>
<head>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
</br>

<select id="myDlist">
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
<option value="4">four</option>
</select>
<button id="btn">Click me</button>

<script type="text/javascript">
$("#btn").on('click',function(){
//console.log($('#myDlist option:selected').val());
console.log($('#myDlist').val());
});
</script>

</body>
</html>

http://www.webkaka.com/tutorial/js/2019/050544/

jquery获取select下拉框的前一个，后一个，第一个，最后一个option对象

$("select option:selected").next();<select><option value="1" selected="selected">a</option><option value="2">b</option><option value="3">c</option>
</select><script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js" type="text/javascript"></script><script>$(function() {$("select").change(function(event) {var obj = $(this).find("option:selected").next();alert("选中项的下一个: 内容"+obj.html()+",值"+obj.val());});})
</script>

//select 当前当前选中的最后一个 option对象

var aucNum=$("#secOrderNum option:selected").text();
var aucNumLast=$("#secOrderNum option:last-child").text();

//select 当前当前选中的后一个 option对象

aucNum = $("#secOrderNum").find("option:selected").next().text();

//select 当前当前选中的第一个 option对象
var aucNum=$("#secOrderNum option:selected").text();
var aucNumFirst=$("#secOrderNum option:first-child").text();//select 当前当前选中的前一个 option对象aucNum = $("#secOrderNum").find("option:selected").prev().text();

https://www.cnblogs.com/mr-wuxiansheng/p/6735023.html

jQuery获取下拉菜单列表的值相关推荐

5种jQuery美化下拉菜单列表插件
下载地址一些不错的自定义下拉列表使用CSS和jQuery, 有五个不同的下拉菜单和列表例子用于各种目的. dd:
php获取下拉菜单多选值,PHP 下拉菜单多选
如果下拉菜单是多选的( multiple="multiple"),我们可以通过将设置 select name="q[]" 以数组的方式获取,以下使用 POST ...
jQuery EasyUI 下拉菜单获取日期，最高年份为当前年份，最低年份为当前年份向前推10年...
http://blog.csdn.net/wangjingjing1014/article/details/16885341 <head> <meta http-equiv=&quo ...
如何JQ将下拉列表的值传送给php,JQuery设置获取下拉菜单某个选项的值(比较全)...
JQuery获取和设置Select选项获取Select : 获取select 选中的 text : $("#ddlRegType").find("option:sele ...
使用Jquery、HTML、CSS、JS实现下拉菜单列表
下拉菜单列表当鼠标进入时,效果如下: 鼠标离开时,下拉列表进行隐藏.效果如下: 下面展示代码 // <!DOCTYPE html> <html lang="en" ...
随手记一次用C#正则表达式获取下拉菜单html标签select以及相关属性值
随手记一次用C#正则表达式获取下拉菜单html标签<select>以及相关属性值 1:有如下html: .................. <select id="aaa ...
jquery中获取下拉框的文本值
获取下拉框的属性值:$(this).val(); 获取下拉框的文本值:$(this).find('option:selected').text();
jQuery练习——下拉菜单
哈喽大家好,本次是jQuery案例练习系列第一期,本期是用jQuery实现下拉菜单. 笔者还是前端的菜鸟,还请大家多多指教呀~ 欢迎大佬指正,一起学习,一起加油! 第一期--下拉菜单的实现文章目录 ...
html下拉菜单插件,简单的jQuery大型下拉菜单插件
booNavigation是一款简单的jQuery大型下拉菜单插件.通过该插件可以制作3列大型下拉菜单,并带有平滑过渡效果,以及鼠标滑过菜单项时的动画效果. 使用方法在页面中引入jquery和boo ...

jQuery获取下拉菜单列表的值