JavaScript 函数并不执行所有内容

Question

我有一个数组Orte，其中包含邮政编码和城市名称。 现在我想根据输入字段中输入的数字更改下拉列表。 输入字段有一个 onchange 函数。该函数如下所示。

到目前为止，除了 for 循环之后的最后一行之外，脚本都有效。它永远不会添加最后一部分，我不知道为什么。 有人可以帮我吗？

提前感谢您的回答! bool 兹

function updateOrt(eingabe){    
    document.getElementById("ort_platzhalter").innerHTML = '<select name="ort">'
    for (var i = 1; i <= Orte.length; i++){ 
        if(Orte[i].PLZ == eingabe){
            document.getElementById("ort_platzhalter").innerHTML += '<option value="' + Orte[i].id + '">' + Orte[i].Ort + '</option>'
        }
    } 
    document.getElementById("ort_platzhalter").innerHTML += "</select>"
}

Answer 1

您应该一次性更新innerHTML。首先构建字符串，然后分配它。另外，数组是零索引的，所以我猜你想从 0 开始，并在达到 Orte 的长度(i = Orte.length)时结束。

function updateOrt(eingabe){
    var str = '<select name="ort">'
    for (var i = 0; i < Orte.length; i++){ 
        if(Orte[i].PLZ == eingabe){
            str += '<option value="' + Orte[i].id + '">' + Orte[i].Ort + '</option>'
        }
    } 
    str += "</select>"
    // now assign the str to innerHTML
    document.getElementById("ort_platzhalter").innerHTML = str;
}