时间戳

首页 > 解决方案 > 使用jQuery选择多选下拉列表的ID？

jquery - 使用jQuery选择多选下拉列表的ID？

问题描述

如何使用 jQuery 检索所选书籍的 ID？

下拉列表：

<select class="form-control" id="books_ids" multiple="true" name="Books"> 
   <option value="">Select Books</option>
   <option value="1">C# In Depth</option>
   <option value="2">C# CLR</option>
   <option value="3">C# Beginner Guide</option>
   <option value="4">Head First C#</option>
   <option value="5">jQuery In Action</option>
   <option value="8">jQuery Head First</option>
</select>

jQuery 代码：（我尝试过，但无法按预期检索 id）？

<script type="text/javascript">
    jQuery(document).ready(function () {
        debugger
        var booksIds = [];
        jQuery("#btn_Test").on("click", function () {
            jQuery("#books_ids option:selected").each(function(index,element) {
               booksIds.push(element);
            })
            debugger
            console.log(booksIds)
        })
    });
</script>

提前致谢。

标签： jqueryhtml

解决方案

.val()在多选选择元素上使用该函数将返回所选值的数组：

var selectedValues = $('#multipleSelect').val();

在你的 html 中：

<select id="multipleSelect" multiple="multiple">
    <option value="1">Text 1</option>
    <option value="2">Text 2</option>
    <option value="3">Text 3</option>
</select>

您还可以使用.text()来获取文本值。

这是一个小代码笔示例： https ://codepen.io/anon/pen/PVqZJq ?editors=1111

推荐阅读