下拉列表中没有值

Values are not coming in dropdown

本文关键字：下拉列表      更新时间：2023-09-26

Html:

 <body>
<label>
    Year:
</label>
<select id="selectMe">
    <option>
    </option>
</select>
</br>
<label>
    Make:
</label>
<select>
    <option>
    </option>
</select>
</br>
<label>
    Model:
</label>
<select>
    <option>
    </option>
</select>
</br>
<script src="script.js" type="text/javascript"></script>

Javascript：

 function printIteration(){
var vehicleData = [{year: 2015, make: "Audi", model: "A4"},
    {year: 2014, make: "Benz", model: "c2000"},
    {year: 2015, make: "Maruti", model: "s-cross"},
    {year: 2015, make: "Maruti", model: "WagonR"}
];
for(var i = 0; i<vehicleData.length; i++){
    //console.log(vehicleData[i]);
    for( var i= 0; i<vehicleData.length; i++){
        //console.log(vehicleData[i].year);
        document.write(vehicleData[i].year + "</br>")
    }
}
}
 printIteration();
function buildDropdownYear(){
var yearSelect = document.getElementById("selectMe");
var drop1 = document.createElement("option");
yearSelect.appendChild(carYear);
var carYear = buildCtrl("data1","option");
}
buildDropdownYear();
function buildCtrl(data,ctrl){
var item = document.createElement(ctrl);
if(data){
    item.innerHTML = data;
}
return item;
}

我是javascript的新手。我刚开始学习，我有点困在这里，因为我不知道错误是什么。控制台显示了这个错误：

TypeError: Argument 1 of Node.appendChild is not an object.
yearSelect.appendChild(carYear);

我的双关语是：http://plnkr.co/edit/fMufqCctzHe4Umbpu6Ag?p=preview

有人能告诉我我做错了什么吗？

您的代码中有太多问题。

  • 既然option标记已经存在，为什么要创建它在HTML？将其添加到HTML或js中，而不是同时添加。

  • 另外，正如其他人指出的，您正在尝试访问一个变量甚至在它被定义之前。

  • 我注意到的另一个问题是，你没有传递数据需要追加，但只需将字符串data1作为您的功能。在您的情况下，应该传递vehicleData数组。

  • 作为document.write的推荐替代方案，您可以使用DOM直接查询节点元素并将其添加到DOM的操作。

    试着去理解你想做什么，一步一个脚印。解决你的问题。你会到达那里的。我已经分叉了你的Plunk并对其进行了修改，以便将年份值添加到下拉列表中。您可以对其他下拉项执行相同操作。

    这是Plunker。

还应考虑评论部分给出的建议

 var vehicleData = [{year: 2015, make: "Audi", model: "A4"},
        {year: 2014, make: "Benz", model: "c2000"},
        {year: 2015, make: "Maruti", model: "s-cross"},
        {year: 2015, make: "Maruti", model: "WagonR"}
    ];

for(var i = 0; i<vehicleData.length; i++){
    buildDropdownYear(i);
}
function buildDropdownYear(k) {
    var yearSelect = document.getElementById("selectMe");
    var drop1 = document.createElement("option");
    var carYear = buildCtrl(k, vehicleData,"option");
    yearSelect.appendChild(carYear);
}
function buildCtrl(k, data,ctrl){
    var item = document.createElement(ctrl);
    if(data){
        item.innerHTML = data[k].year;
    }
    return item;
}

如果我从一个新的代码开始，我不会这样做。这里还有很大的改进空间。

在yearSelect.appendChild(carYear);中，carYear未初始化。

var carYear = buildCtrl("data1","option");应位于上述行之前。

Plunker

相关文章：