Javascript 使用d3从“多个”下拉菜单中查找用户选择的选项？_Javascript_Html_Drop Down Menu_D3.js

Javascript 使用d3从“多个”下拉菜单中查找用户选择的选项？

javascript html drop-down-menu d3.js

Javascript 使用d3从“多个”下拉菜单中查找用户选择的选项？,javascript,html,drop-down-menu,d3.js,Javascript,Html,Drop Down Menu,D3.js,使用下拉列表时，我很难找到选定的选项因此，有一些讨论是为了从下拉菜单中找到用户选择的选项（不是复数：，）主要问题在下面的代码中 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://d3js.org/d3.v3.min.js"></script> <style>

使用

下拉列表时，我很难找到选定的选项

因此，有一些讨论是为了从下拉菜单中找到用户选择的选项（不是复数：，）

主要问题在下面的代码中

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <script src="http://d3js.org/d3.v3.min.js"></script>
        <style>
        </style>
    </head>
    <body>
        <div>
            <select multiple id="menu">
            </select>
        </div>
        <script>
            var some_array=["Bob","Tom"]
            var menu = d3.selectAll("#menu")

            menu.selectAll("option")
                .data(some_array)
                .enter()
                .append("option")
                .attr("value", function(d) { return d; })
                .text(function(d) { return d; }); 

            menu.on("change",function(event) {
                //HOW CAN I GET THE OPTION(S) THAT THE USER HAS SELECTED?
                //BEST GUESS:
                selections=d3.select(this).selectAll("options:checked")
                console.log(selections) 
            })
        </script>
    </body>
</html>


var some_数组=[“Bob”，“Tom”]
变量菜单=d3。选择全部（“菜单”）
菜单。选择全部（“选项”）
.数据（某些数组）
.输入（）
.附加（“期权”）
.attr（“值”，函数（d）{return d；}）
.text（函数（d）{return d；}）；
菜单打开（“更改”，功能（事件）{
//如何获取用户选择的选项？
//最佳猜测：
选择=d3。选择（此）。选择全部（“选项：选中”）
console.log（选项）
})

这个脚本的问题是，我没有看到控制台中显示的数组中的值“Bob”和“Tom”

我知道用d3做这件事最简单的方法就是过滤你的选择

d3.select(this)
    .selectAll("option")
    .filter(function (d, i) { 
        return this.selected; 
    });

该选项将获取所有选项，然后过滤掉未选择的选项。

找到了一个更简单的选项

    options = []
    for (var option of d3.select('#menu').property("selectedOptions")){
        options.push(option.value)
    }

谢谢，

这只是

selections=菜单。selectAll（“选项：选中”）

，不是吗？您正在选择一组元素。简单地打印它们将打印一个数组，而不是选中的选项。@Larskothoff-您的建议与我上面的建议相同。@MikePrecup-它确实是一个数组；但是，在任何地方（我都找不到）都没有包含所需项的数组，即[“Bob”、“Tom”]。这可能是一个新问题，但当我控制台.log（此）时，我看不到.selected值，即使这样做有效@MikePrecup，你能解释一下d3的内容吗？选择（this）并具体说明你在哪里使用this。选择的？

this

指的是两种用法中的不同内容。最常用的用法是指

select

，因为它是调用回调的对象，而第二个

this

是指

选项。Filter对当前选择进行迭代，并在每个选择上运行筛选器，因此this
会为它当时正在处理的选项
获取一个引用。这是有道理的，但保存.selected值的是什么？我（可能很天真地）认为this
是一个对象，它的键被选中
，在调用时将返回一个特定值，如this.selected
；但是，我找不到名为selected
的值。请查看。选项
的一个属性是选中的
在第二种用法中，它确实为选项
提供了DOM元素，因此您的想法是正确的。我不知道你用什么来检查这个
，但是属性确实存在。打印出来应该会显示它是一个选项
元素，链接的文档显示应该有一个选中的
属性。嗨，我想知道我们是否可以得到一个选项值数组而不是选项？