Javascript元素名称更改恢复为原始

克隆的输入元素“terminal0”的JavaScript名称更改在功能结束后不保存和/或恢复为原始名称。所有其他名称/ ID更改都可以使用，但第一个元素名称更改会在函数完成后恢复。即使是第一个元素“terminal0”ID更改成功。我已经测试并确认名称更改在函数退出之前通过在其末尾放置警报（cTerm.name）进行工作。任何人都知道为什么名称更改不适用于第一个输入元素的原因？Javascript元素名称更改恢复为原始

<tr id="tr1"> 
<td id="tr1Td0"> 
Terminal <input type="checkbox" name="terminal0" id="terminal0" value="0" onClick="cbUpdate()"> 
<br> 
Imager <input type="checkbox" name="imager0" id="imager0" value="0" onClick="cbUpdate()"> 
</td> 
</tr> 
</tbody> 
</table> 

function addTable() 
{ 
    var gssTable = document.getElementById("gssTable"); 
    var currTables = gssTable.rows[0].cells.length; 
    var selNum = document.getElementById("sNum").value; 
    var tr0 = document.getElementById("tr0"); 
    var tr1 = document.getElementById("tr1"); 
    var br = document.createElement('br'); 

    for(x=currTables; x < selNum; x++) 
    { 
     var tr0Td0 = tr0.insertCell(-1); 
     var setID0 = document.getElementById("setID0"); 
     var cSetID = setID0.cloneNode(true); 
     cSetID.id = "setID" + x; 
     cSetID.name = "setID" + x; 
     tr0Td0.appendChild(cSetID); 

     var tr1Td0 = tr1.insertCell(-1); 
     tr1Td0.innerHTML="Terminal"; 
     var terminal0 = document.getElementById("terminal0"); 
     var cTerm = terminal0.cloneNode(true); 
     cTerm.id = "test" + x; 
     cTerm.name = "test" + x; 
     tr1Td0.appendChild(cTerm); 
     tr1Td0.appendChild(br); 
     tr1Td0.innerHTML = tr1Td0.innerHTML + "Imager" 
     var imager0 = document.getElementById("imager0"); 
     var cImager = imager0.cloneNode(true); 
     cImager.id = "imager" + x; 
     cImager.name = "imager" + x; 
     tr1Td0.appendChild(cImager); 
    } 

    while (currTables > selNum) 
    { 
     tr1.deleteCell(-1); 
     tr0.deleteCell(-1); 

     currTables = currTables - 1; 
    }

来源

2015-05-07 Jimmy Goodson

你能制作一个可执行代码片段或jsfiddle来演示这个问题吗？ – Barmar

而不是设置innerHTML，每一次，你可以创建一个文本节点和appendChild它，即'tr1Td0.appendChild（document.createTextNode（“Imager”））' –

我试图做一个jsfiddle的例子，但我使用因为它似乎并没有正确的行事。基本上问题是第一个输入名称不会像其他所有内容一样发生变化，我不知道为什么。 –

设置innerHTML会使浏览器重新呈现该元素及其内容。由于您在循环中进行每次迭代，因此您可能会导致竞争条件，其中innerHTML尚未更新为其上的appendChild调用的最新效果。

因此，每次您只需创建一个Text node,createTextNode并添加它，而不是设置innerHTML。

tr1Td0.appendChild(document.createTextNode("Imager"));

来源

2015-05-07 00:41:10

TY @PatrickEvans为解释你的原始解决方案为什么工作背后的逻辑。这意味着对我很重要。 TYTY –

Javascript元素名称更改恢复为原始

回答

相关问题