Javascript 用一个数组填充多个下拉列表

大家好，我有一个简单的问题，我被难住了。我真的不知道该怎么办。我有一个这样的函数

     function getThevalues(data) {
     for (var i = 1; i < data.d.length; i++) {

         MystartingLocation[i] = {}
         MystartingLocation[i]["locName"] = {}
         MystartingLocation[i]["locNode"] = {}

                var Opts  = document.createElement("option");
                var Opt = document.createElement("opo");
                MystartingLocation[i]["locNode"] = data.d[i].locNode;
                MystartingLocation[i]["locName"] = data.d[i].locName;
                Opts.text = data.d[i].locName;
                //Opt.text = data.d[i].locName;
                try {
                    document.getElementById("StartLocations").options.add(Opts);
                    document.getElementById("EndLocations").options.add(Opts);

                 }
       catch (e) {console.log(e);}


     }
 }

函数获取值（数据）{
对于（变量i=1；i

我试图用相同的值填充“开始位置”和“结束位置”下拉列表，但每次尝试都只填充其中一个“结束位置”。我做错了什么？谁能给我指一下正确的方向吗。 谢谢

---

Miguel

不能将同一元素添加到文档中的两个位置

您需要创建两个

option

元素，或者克隆现有的元素

document.getElementById("EndLocations").options.add(Opts.cloneNode(true));

---

使用两个

选项

元素将如下所示：

 function getThevalues(data) {
     for (var i = 1; i < data.d.length; i++) {

         MystartingLocation[i] = {}
         MystartingLocation[i]["locName"] = {}

         var OptA = document.createElement("option");
         var OptB = document.createElement("option");

         MystartingLocation[i]["locNode"] = data.d[i].locNode;

         OptA.text = data.d[i].locName;
         OptB.text = data.d[i].locName;

         try {
             document.getElementById("StartLocations").options.add(OptA);
             document.getElementById("EndLocations").options.add(OptB);
         }
         catch (e) {console.log(e);} 
     }
 }

函数获取值（数据）{
对于（变量i=1；i

不能将同一元素添加到文档中的两个位置

您需要创建两个

option

元素，或者克隆现有的元素

document.getElementById("EndLocations").options.add(Opts.cloneNode(true));

---

使用两个

选项

元素将如下所示：

 function getThevalues(data) {
     for (var i = 1; i < data.d.length; i++) {

         MystartingLocation[i] = {}
         MystartingLocation[i]["locName"] = {}

         var OptA = document.createElement("option");
         var OptB = document.createElement("option");

         MystartingLocation[i]["locNode"] = data.d[i].locNode;

         OptA.text = data.d[i].locName;
         OptB.text = data.d[i].locName;

         try {
             document.getElementById("StartLocations").options.add(OptA);
             document.getElementById("EndLocations").options.add(OptB);
         }
         catch (e) {console.log(e);} 
     }
 }

函数获取值（数据）{
对于（变量i=1；i

您正带着同一个孩子，并移动它

document.getElementById("StartLocations").options.add(Opts);
document.getElementById("EndLocations").options.add(Opts);

Opts

变量被添加到

StartLocations

中，然后从那里提取并添加到

EndLocations

如果注释掉第二行并运行代码，则可以看到这种情况：

document.getElementById("StartLocations").options.add(Opts);
//document.getElementById("EndLocations").options.add(Opts);

您需要创建两个不同的

元素，并分别附加每个元素

---

在行动中：

function getThevalues(data) {
    var optStart;
    var optEnd;

    for (var i = 1; i < data.d.length; i++) {
        optStart = document.createElement("option");
        optEnd= document.createElement("option");

        optStart.text = data.d[i].locName;
        optEnd.text = data.d[i].locName;

        document.getElementById("StartLocations").options.add(Opts);
        document.getElementById("EndLocations").options.add(Opts);
    }
}

函数获取值（数据）{
var-optStart；
var optEnd；
对于（变量i=1；i

您正带着同一个孩子，并移动它

document.getElementById("StartLocations").options.add(Opts);
document.getElementById("EndLocations").options.add(Opts);

Opts

变量被添加到

StartLocations

中，然后从那里提取并添加到

EndLocations

如果注释掉第二行并运行代码，则可以看到这种情况：

document.getElementById("StartLocations").options.add(Opts);
//document.getElementById("EndLocations").options.add(Opts);

您需要创建两个不同的

元素，并分别附加每个元素

---

在行动中：

function getThevalues(data) {
    var optStart;
    var optEnd;

    for (var i = 1; i < data.d.length; i++) {
        optStart = document.createElement("option");
        optEnd= document.createElement("option");

        optStart.text = data.d[i].locName;
        optEnd.text = data.d[i].locName;

        document.getElementById("StartLocations").options.add(Opts);
        document.getElementById("EndLocations").options.add(Opts);
    }
}

函数获取值（数据）{
var-optStart；
var optEnd；
对于（变量i=1；i

不需要这些行

MystartingLocation[i]["locName"] = {}
MystartingLocation[i]["locNode"] = {}

因为它将一个对象嵌套在一个对象中，所以不需要线条

MystartingLocation[i]["locName"] = {}
MystartingLocation[i]["locNode"] = {}

---

因为它会将一个对象嵌套在一个对象中

我相信我的答案肯定需要编辑，你能发布你的

数据的结构吗。在这种特殊情况下，将对象放在对象中是有原因的。感谢您的回复。根据
MystartingLocation[i][“locNode”]=data.d[i].locNode
，看起来像是
data.d[i]。locNode
是一个字符串，但在您的数据结构
MystartingLocation[i][“locNode”]={}
中，您将其声明为一个对象。我可能错了，你能在这里发布你的
数据
回复吗？我相信我的答案肯定需要编辑，你能发布你的
数据
的结构吗？如果我有点需要的话。在这种特殊情况下，将对象放在对象中是有原因的。感谢您的回复。根据
MystartingLocation[i][“locNode”]=data.d[i].locNode
，看起来像是
data.d[i]。locNode
是一个字符串，但在您的数据结构
MystartingLocation[i][“locNode”]={}
中，您将其声明为一个对象。我可能错了，是吗