重复的DIV当Enter点击时，DIV中的输入元素焦点为焦点

Question

我需要在命中输入时复制div时需要帮助

因此，有一个DIV，其中有一个输入元素。我需要复制此div，并在光标在输入元素中时，每当输入时，将其放在现有的div下方。

不使用jQuery的解决方案将有很大的帮助。

谢谢

Answer 1

这是一个高级概述...

• 在input元素上收听keypress事件，13的keyCode。
• 使用cloneNode()克隆节点。
• 使用最合适的节点插入方法，例如appendChild()插入克隆元素。

Answer 2

尝试此

演示

<div id='container'>
<div id='div1'>
<input type='text' onkeyup='clone_element(event)' />
</div>
</div>
<script>
function clone_element(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if(charCode == 13){
 var cDiv = document.getElementById("div1");
        var clonedDiv = cDiv.cloneNode (true);
        clonedDiv.id = "";
        var container = document.getElementById ("container");
        container.appendChild(clonedDiv);
}
}
</script>  

Answer 3

您可以使用以下功能来克隆DIV。这很可能是Alex提到的解决方案。我添加了代码。

function cloning(divid) {
    var container = document.getElementById(divid);
    var clone = document.getElementById('div_0').cloneNode(true);
    clone.setAttribute('id','div_'+document.getElementById(divid).getElementsByTagName('div').length);
    container.appendChild (clone);
}

击中Enter时调用上述功能。

<script language = "javascript">
function searchKeyPress(e)
    {
    // look for window.event in case event isn't passed in
     if (typeof e == 'undefined' && window.event) { e = window.event; }
     if (e.keyCode == 13)
      {
        alert("Enter received");
        cloning('divid');
      }
    }   
</script>
<input type="text" onkeydown="searchKeyPress()">