Question

当div中的输入元素处于焦点时，当命中输入时，我需要帮助重复div

所以有一个div，里面有一个输入元素。我需要复制这个div并将其放在现有div的正下方，只要在光标位于input元素中时命中enter。

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

由于

Answer 1

以下是高级概述......

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

Answer 2

试试这个

<强> Demo

<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()">

当div中的input元素处于焦点时，当命中enter时重复div

3 个答案: