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。

我一直试图改变

xField.relatedElement = newRow; 上 newRow.addChild(xField);

它也不起作用。

提前感谢您的回答。

Answer 1

首先你做

xField.relatedElement = newRow;

然后你改变了

newRow.innerHTML

当然会反映在relatedElement中。

如果你想要三个不同的DOM元素，你必须制作三个不同的DOM元素，而不仅仅是你分配给三个地方的一个，你的内容你改变了三次。

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

1 个答案: