当我们需要获取下拉菜单或者列表框中选中选项的文本时，可以使用 jQuery 快速实现这个功能。在本篇文章中，我们将介绍如何使用 jQuery 获取选中选项的文本，并提供相应的示例代码。
使用 val() 方法获取选中选项的值
通常情况下，我们使用 jQuery 的 val() 方法来获取下拉菜单或者列表框中选中选项的值，例如：
const selectedOptionValue = $('#select-id').val();但是有时候，我们需要获取选中选项的文本而不是值。在这种情况下，我们可以结合使用 :selected 选择器和 text() 方法来获取选中选项的文本。
使用 :selected 选择器和 text() 方法获取选中选项的文本
:selected 选择器表示选中的选项，在 jQuery 中，它可以用于获取下拉菜单或者列表框中选中的选项元素。而 text() 方法则用于获取元素的文本内容。
因此，我们可以通过以下代码来获取选中选项的文本：
const selectedOptionText = $('#select-id option:selected').text();其中，#select-id 表示下拉菜单或者列表框的 ID，.option:selected 表示选中的选项元素，.text() 则返回选中选项的文本内容。
需要注意的是，如果没有选中任何选项，则 text() 方法将返回空字符串。
示例代码
下面是一个简单的示例，演示如何使用 jQuery 获取选中选项的文本：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
------------- -----------------
------- -----------------------------------------------------------
--------
---------------------------- -
--------------------------------- -
----- ------------------ - ------------- -------------------------
----------------------------------------------------
---
---
---------
-------
------
------ --------------------------------
------- ---------------
------- ------------------ ----------
------- ------------------ ----------
------- ------------------ ----------
---------
---------------- -------------------------------------
-------
-------在上面的示例中，我们创建了一个下拉菜单，并为其添加了一个 change 事件监听器。当用户选择了一个选项时，该监听器会获取选中选项的文本，并将其写入到页面中的 <span> 元素中。
总结
通过本篇文章，我们学习了如何使用 jQuery 快速获取下拉菜单或者列表框中选中选项的文本。同时，我们也提供了相应的示例代码，希望能够帮助读者更好地理解和应用本文介绍的知识点。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27302