Javascript 在div之间移动输入

试图通过移动按钮将用户输入从一个div来回移动到另一个div。即使有多个输入，也可以将所选输入从一个移动到另一个。 到目前为止，它将“field1”中的所有输入移动到“field2”。我只想前后移动一行

尝试了各种各样的东西，仍然在学习。为了达到这个目的，我需要看些什么` 谢谢你的帮助

var编号=[]；
函数myNotes（）{
var x=document.getElementById（“field1”）；
number.push（document.getElementById（“输入”）.value）；
x、 innerHTML=number.join（“
”）；
}
函数move（）{
$（“#字段1”）。附加到（“#字段2”）
}

表单{
显示：内联；
}

字段1
字段2

javascript和jQuery的混合使用让人难以理解。我已经使用jQuery创建了一个这样的示例，因为您的项目中似乎有它：

HTML:

---

javascript和jQuery混合在一起很难理解。我已经使用jQuery创建了一个这样的示例，因为您的项目中似乎有它：

HTML:

---

你能不能把你想要达到的目标说清楚一点？我无法判断您是否要将输入框中的文本移动到div的文本中，或者是否要移动div或其他内容。输入显示在“field1”中后，右侧会出现一个移动按钮。单击此按钮可将文本移动到“字段2”。您是否可以将移动按钮

再次单击

执行类似操作：

document.getElementById（'field2'）。innerHTML=document.getElementById（'field1'）。innerHTML

？（或

。如果您不想使用
。innerHTML
）是，但这样做会将所有输入移动到字段中，若有超过1个输入。我只想把一个输入（几个输入中的一个）移到字段2，剩下的输入留在字段1。你能更清楚一点你想要实现什么吗？我无法判断您是否要将输入框中的文本移动到div的文本中，或者是否要移动div或其他内容。输入显示在“field1”中后，右侧会出现一个移动按钮。单击此按钮可将文本移动到“字段2”。您是否可以将移动按钮
再次单击
执行类似操作：
document.getElementById（'field2'）。innerHTML=document.getElementById（'field1'）。innerHTML
？（或
。如果您不想使用
。innerHTML
）是，但这样做会将所有输入移动到字段中，若有超过1个输入。我试着只将一个输入（从几个输入中选择一个）移动到字段2，将其余的输入留在字段1。这是一个比我的尝试好得多的答案。我唯一要添加的是可用性（清除并将输入集中在单击上）。我正在工作，所以我很快就完成了这项工作，但很好！请随时更新小提琴，编辑我的答案。这是一个比我的尝试更好的答案。我唯一要添加的是可用性（清除并将输入集中在单击上）。我正在工作，所以我很快就完成了这项工作，但很好！随时更新小提琴，编辑我的答案。
<form>
  <input id="input" type=text>
</form>
<input type=submit id="btnSend" value="Send">

<br>
<span id='displaytitle'></span>
<h2>Field 1</h2>
<div id="field1" class="field"></div>
<h2>Field 2</h2>
<div id="field2" class="field"></div>

//listen for document ready
$(document).ready(function() { 
    //button click listener:
    $("#btnSend").on("click", function(e) {

        var $field1 = $("#field1");  //works like getElementById

        //create a containing div for later
        var $entry = $("<div></div>").addClass("entry");

        //create a new button
        var $btnMove = $("<input/>").attr("type", "button").attr("value", "move").addClass("btnMove");

        //click listener for the new button
        $btnMove.click(function(){              
          //find "sibling" field (I added a class to both), append this button's parent div
          $(this).parents(".field").siblings(".field").append($(this).parent());
        });

        //append entry parts
        $entry.append($("#input").val())
              .append($btnMove);

        //append entry to #field1
        $field1.append($entry);          
    });
 });

form {
  display: inline;
}

.btnMove {
  margin-left: .5em;
}