Javascript代码中的命令被最后一个命令覆盖

我已经把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);});

newRow.innerHTML=“”；
newRow.innerHTML+='X:'；
var xField=document.getElementById（'x'+ddList.ddEl.id）；
xField.relatedElement=newRow；
newRow.innerHTML+=“Y:”；
var yField=document.getElementById（'y'+ddList.ddEl.id）；
yField.relatedElement=新行；
$（xField）.blur（函数（）{alert（'X.blur（）的处理程序被调用'）}）；
$（yField.blur（function（）{ddList.setObjectPosition（yField，obj，'y'）；}）；
if（RegExprText.test（ddList.ddEl.id））
{
newRow.innerHTML+='
Kolor:'；
var-element=document.createElement（'input'）；
setAttribute（'id'，'c'+ddList.ddEl.id）；
setAttribute（'name'，'c'+ddList.ddEl.id）；
setAttribute（'type'，'text'）；
setAttribute（'class'，'color'）；
setAttribute（'size'，'6'）；
newRow.appendChild（元素）；
var myPicker=newjscolor.color（元素，{}）；
$（element.blur（function（）{ddList.setColor（element，obj）；}）；
}
var links=newRow.getElementsByTagName（'a'）；
var editLink=links[links.length-1]；
editLink.relatedElement=newRow；
$（编辑链接）。单击（函数（）{ddList.deleteObject（obj，newRow）；}）；

所以当我只有X和Y输入字段时，只有Y是活动的。当我有X，Y和colorPicker时，只有colorPicker工作

有趣的是，它总是在代码的最后一行工作——editLink

我一直在努力改变

xField.relatedElement=newRow；

在…上

newRow.addChild（xField）；

它也不起作用

感谢您提前给出答案。

请先回答

xField.relatedElement = newRow;

然后你就改变了

newRow.innerHTML

这当然会反映在相关元素中

如果您想要三个不同的DOM元素，您必须创建三个不同的DOM元素，而不仅仅是一个分配给三个位置并更改其内容三次的DOM元素。

首先要做的是

xField.relatedElement = newRow;

然后你就改变了

newRow.innerHTML

这当然会反映在相关元素中

---

如果您想要三个不同的DOM元素，那么必须创建三个不同的DOM元素，而不仅仅是一个分配给三个位置并且内容更改三次的DOM元素。

非常感谢，但我还有一个问题。我现在如何定义xField，因为我不能使用

var xField=document.getElementById（'x'+ddList.ddEl.id）

我没有这个元素？非常感谢，但我还有一个问题。我现在如何定义xField，因为我不能使用

var xField=document.getElementById（'x'+ddList.ddEl.id）；

我没有这个元素？