使用JavaScript添加订单项时，如何处理HTML元素ID和Javascript引用？

Question

首先，我阅读了所有听起来有些相关的建议问题，但都没有找到解决我问题的方法。 其次，如果已经解决了该问题，我对此的搜索不够。 最后，解决问题。 ：D

我的页面上有一个“订单项”。 就我们的目的而言，“订单项”只是水平行中的一堆HTML元素，这些HTML元素形成了一行HTML输入（例如，想象诸如“件数”，“描述”，“重量”，“单位费率”，“总费率”之类的列）。 我们订单项中的HTML控件之一实际上是一个自定义服务器控件，该控件发出一些Javascript。 除其他外，Javascript将X类型的对象更新为：

var whatever = new X(constructor values);

现在，用户可以使用“添加”按钮添加订单项。 目前，我只是克隆构成订单项的HTML的干净副本。 这也将克隆Javascript代码，以便现在，每个订单项都具有var whatever = new X(constructor values); 。 这就带来了一个问题，因为有几行都引用同一个Javascript变量（即whatever ）。

当然，这破坏了b / c我需要引用的whatever作为单独的实例，而不是同一实例。 我想知道是否有处理这种情况的方法。 如何使用自定义服务器控件，但仍引用每一行发出的Javascript？ 还是如何避免这种问题的方式创建新的订单项？

我是整个使用Java进行DOM修改的新手，我似乎找不到任何有用的最佳实践或示例，因此我有点茫然。

这一切有意义吗？ 如果没有，请让我知道不可以的原因，我会尽力清除。

编辑：这是一个小代码示例。

这正是JavaScript对象声明的样子：

var example = new SmartDropDown('uomSDD','75','1','7','','','','',2);

第一个参数是呈现的元素之一的HTML ID，由于这个原因，我不能只使用数组（如答案中所述；一个很棒的答案，但是，直到我意识到我忘了提及该细节）。 我需要想出一种方法来更改ID 并使用数组。

SmartDropDown对象上的一些方法是ShowOptions ， HideOptions ， BindOptions 。

至于单击按钮时调用的代码，这里是：

function AddLineItem()
{
    var lineItemsParent = $("lineItems");
    var newRow = lineItemTemplateNode.cloneNode(true);
    lineItemsParent.appendChild(newRow);
}

因此，总而言之，订单项HTML包含通常的内容：输入，选择，跨度等，然后是上面列出的JS声明。 而且由于我添加新订单项的方式（使用上面的代码），JS变量也被克隆了。 我需要一种方法来1）更改元素的ID和2）跟踪所有JS引用（已经建议使用数组）。

Answer 1

使用数组？

   var lineItems = [];
   ...
   // when the button is clicked
   lineItems[lineItems.length] = new X(constructor values); 

如果您需要同时生成一个新的ID，则可以在数组索引前添加一个字符串。

   var lineItems = [];
   ...
   // when the button is clicked
   var id = 'item_' + lineItems.length.toString()
   lineItems[lineItems.length] = new X(id, ...); 

Answer 2

这是JavaScript框架真正方便的地方。 许多人都有很好的构造函数，可以使这种事情变得容易。 例如，使用Prototype ，我可以这样做：

function buildMe(counter) {
    var tempHTML = new Element('div',{'id':'bleh'+counter,className:'product'})
    tempHTML.insert(new Element('a',{className:'prodTitleLinkA',href:'/here'})

    $('someDiv').insert(tempHTML)
    Event.observe('bleh'+count, 'click', function(event) {
       alert(element.id)
    });
}

这将创建一些元素，并将一个事件与其关联。 我可以不断地将尽可能多的内容推入“ someDiv”，每个都有自己的ID和事件。

Answer 3

我想我需要更多信息才能为您提供一个很好的答案。 您能否显示一些示例代码，如何调用您的函数，将什么分配给var以及您希望/可以提供的其他信息。 越多越好！

如果可以的话，我会很乐意提供帮助。