Javascript和DOM - insertBefore只能执行一次

我有一个简单的脚本，将表格行复制到全局JavaScript变量（我知道在JavaScript中使用全局变量并不是一个好主意，但这仅用于开发）和在“onClick”事件中插入行的副本的函数。Javascript和DOM - insertBefore只能执行一次

它执行并插入一行。问题是它只会插入一行ONCE。

下面是一个示例表

<table id="myTable"> 
    <tbody> 
     <tr id="copyRow"> 
      <td>Sample Cell</td> 
     </tr> 
     <tr> 
      <td><a href="javascript:void();" onClick="insertRow(copy_row, this.parentNode.parentNode.parentNode)">Insert Row</a></td> 
     </tr> 
    </tbody> 
</table>

这里是我的JavaScript示例：

<script type="text/javascript"> 
    copy_row = document.getElementByID('copyRow').cloneNode(true); //Runs when page first runs 

    function insertRow(insertRow, insertBeforeMe){ 
    insertBeforeMe.parentNode.insertBefore(insertRow, insertBeforeMe) 
    } 
</script>

我很为难

来源

2013-01-04 Alexia Hurley

每次调用insertRow函数时都应克隆节点，以便获取元素的新副本，而不是回收一个克隆的行。

copy_row = document.getElementByID('copyRow'); //Runs when page first runs 

function insertRow(insertRow, insertBeforeMe){ 
insertBeforeMe.parentNode.insertBefore(insertRow.cloneNode(true), insertBeforeMe) 
}

来源

2013-01-04 16:48:18 yaku

修好了！谢谢。你知道为什么回收对象会导致脚本失败吗？ –

不客气。我认为回收（再次插入相同的元素）将实际上从当前父元素中移除该元素，并将其再次插入到不同的地方（或者可能到完全相同的地方，就您的情况而言）。它不会被自动复制/复制，因此您一直处理（移除和插入）相同的单个元素实例。您需要在适当的地方创建新的行/元素。 – yaku

啊！这很有道理。谢谢。 –

它甚至不应该运行一次。 JavaScript是大小写敏感的，所以你必须使用：

document.getElementById

不

document.getElementByID

这是我working version of your script。

来源

2013-01-04 16:46:45 Fenton

Javascript和DOM - insertBefore只能执行一次

回答

相关问题