Question

我有一个或多个html元素集合如下：

<div class="input-group symbol-group">
    <span class="input-group-addon symbol"></span>
    <input type="number" class="form-control" id="cost" />
</div>

在页面的上方，我有一个TextInputElement，可以将任何span.symbol的文本更改为输入的内容（即£，$等）。到目前为止，非常好。

我想要做的是，根据用户选择，将这些跨度中的任何一个与相应的TextInputElement交换，以便{/ 1}}在之后出现 < / strong> TextInputElement（或之前，如果之后已经选中）。

我该怎么做？

编辑：抱歉，我忘记添加我当前的代码（该代码有效但假设元素中只有2个孩子）：

span.symbol

Answer 1

我仍然很难理解你想要完成的事情只要看看我的尝试并评论它是如何做到你需要的。

..onClick.listen((Event e) {
    querySelectorAll('div.symbol-group').forEach((DivElement e) {
        Element e1 = e.querySelector('span.input-group-addon.symbol');
        Element e2 = e.querySelector('input.form-control');
        int i1 = e.indexOf(e1);
        int i2 = e.indexOf(e2);

        if(i1 < i2) {
          e1.remove();
          e.insert(i1, e1);
        }
    });
});

用户点击时如何在Dart中转置html元素

1 个答案: