Question

我想知道option回调函数中提供的onChange参数是否表示optgroup MyGroup元素。

当我在Chrome调试器中浏览option时，会收到以下我不理解的输出：

我在互联网上发现的有关n.fn.init的信息告诉我，该对象尚未实例化，因此以这种方式显示。我对Javascript / jQuery的了解太差，无法自行理解和解决此问题。

我的问题：

如何在onChange函数中访问option参数？

例如，当我将id分配给optgroup并返回此id时，它可以为我提供帮助。

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Bootstrap onChange Example</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/davidstutz/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>
        <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/davidstutz/bootstrap-multiselect/dist/css/bootstrap-multiselect.css" type="text/css"/>
        <script type="text/javascript">
        $(document).ready(function() {
            $('#example').multiselect(
                {
                    enableClickableOptGroups: true,
                    onChange:                 function(option, select)
                    {
                        // how to access option.???
                    }
                }
            )
        });
        </script>
    </head>
    <body>
        <select id="example" multiple="multiple">
            <optgroup label="MyGroup" id="MyGroupId">
                <option value="1">Option 1</option>
                <option value="2">Option 2</option>
                <option value="3">Option 3</option>
            </optgroup>
        </select>
    </body>
</html>

Answer 1

函数参数中的

option可能是jQuery对象的数组。

因为在此示例中，option可能是由于选择了optgroup而需要更改的一组选项，因此您需要迭代或Map该数组并提取所需的信息。

在此示例中，选项值的数组将输出到控制台。

已编辑，此示例现在也输出选项id的数组。

由Al Bundy编辑：

将以下代码放入onChange回调函数中，可以实现所有可能。当optgroup仅包含1个元素时，Steve0的第一个版本不起作用。另外，我的扩展代码-基于原始Steve0的答案-返回id的{{1}}还是返回optgroup的{{1}}，取决于单击哪个：

item

optionId = Array.isArray(option)
   ? $(option[0]).closest("optgroup").attr("id") 
   : option.attr("id");

检查在jQuery Bootstrap Multiselect

1 个答案: