Question

我在html div

中有一个选择框

<div id="selectionBox"></div>

我正在尝试更改此框的位置，但下面的代码无效。从某种意义上说，选择框保持原样，它根本不会移动。

有人可以向我解释为什么这不起作用以及如何解决它？

var select = d3.select("#selectionBox")
  .append('select')
    .attr("transform", "translate(" + 100 + "," + 50 + ")")
    .attr('class', 'select')
    .text("Failure Mode")
    .on('change', onchange);

Answer 1

如果您的代码无效，请尝试更改元素的css样式：

    document.getElementById("selectionBox").style = " margin-left:10px; margin-top:10px; ";
    //Just fill it with your properties

Answer 2

您忘记在px中添加 .attr("transform", "translate(" + 100 + "," + 50 + ")") 。

请参阅translate。

您的代码应为：

var select = d3.select("#selectionBox")
  .append('select')
    .attr("transform", "translate(" + 100 + "px," + 50 + "px)")
    .attr('class', 'select')
    .text("Failure Mode")
    .on('change', onchange);

使用document.getElementById()：

您可以使用 setAttribute() 方法将transform: translate(100px, 50px)添加到selectionBox元素。

这样的事情：

document.getElementById("selectionBox").setAttribute("style", "transform: translate(" + 100 + "px," + 50 + "px)");

在HTML / JavaScript中更改选择框的位置

2 个答案: