Question

我已经堆满了我的javascript代码覆盖。在我的应用程序中，我也使用jQuery来更快地编写一些部分。

的事情是，将功能添加到输入后只有一个加入到最后的工作文件。我发现也许原因是这个相同的参数名称的功能。因此，为了确保我添加了一个我想使用的功能和另一个（我的意思是第一个）使用简单文本的警报。

这是我的代码：

newRow.innerHTML = "<a href='#' class='editName'>"+ddList.ddElements[ddList.ddEl.id]+'</a>'; 
    newRow.innerHTML += ' X:<input type="text" id="x'+ddList.ddEl.id+'" name="x'+ddList.ddEl.id+'" size=3 value=0>'; 
    var xField = document.getElementById('x'+ddList.ddEl.id); 
    xField.relatedElement = newRow; 
    newRow.innerHTML += ' Y:<input type="text" id="y'+ddList.ddEl.id+'" name="y'+ddList.ddEl.id+'" size=3 value=0>'; 
    var yField = document.getElementById('y'+ddList.ddEl.id); 
    yField.relatedElement = newRow; 
    $(xField).blur(function(){alert('Handler for X.blur() called.')}); 
    $(yField).blur(function(){ddList.setObjectPosition(yField,obj,'y');}); 
    if(RegExprText.test(ddList.ddEl.id)) 
    { 
     newRow.innerHTML += '<br>Kolor:'; 
     var element = document.createElement('input'); 
     element.setAttribute('id', 'c'+ddList.ddEl.id); 
     element.setAttribute('name', 'c'+ddList.ddEl.id); 
     element.setAttribute('type', 'text'); 
     element.setAttribute('class', 'color'); 
     element.setAttribute('size', '6'); 
     newRow.appendChild(element); 
     var myPicker = new jscolor.color(element, {}); 
     $(element).blur(function(){ddList.setColor(element,obj);}); 
    } 
    var links = newRow.getElementsByTagName('a'); 
    var editLink = links[links.length-1]; 
    editLink.relatedElement = newRow; 
    $(editLink).click(function(){ddList.deleteObject(obj,newRow);}); 

所以，当我有唯一的X和Y输入字段则只有Y是积极的。当我有X，Y和colorPicker时，只有colorPicker可以工作。

有趣的是，一直是工作的代码最后一行 - EDITLINK。

而且我一直在试图对 newRow.addChild(xField);

它也不管用改变

xField.relatedElement = newRow; 。

感谢提前答案。

Answer 1

首先，你做

xField.relatedElement = newRow; 

然后你改变

newRow.innerHTML 

这当然会在relatedElement反映。

如果你想三个不同的DOM元素，你必须做出三个不同的DOM元素，而不仅仅是一个分配给三个地方，你更改三次其内容。