未定义显示在选项中

undefined is showing up in options

本文关键字：选项 显示 未定义      更新时间：2023-11-29

在JS 中

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"}
];
var uniqueNames=[];
for(var i = 0; i<vehicleData.length; i++){
buildDropdownYear(i);
}
function buildDropdownYear(n) {
var yearSelect = document.getElementById("selectMe");
var drop1 = document.createElement("option");
var carYear = buildCtrl(n, uniqueNames,"option");
yearSelect.appendChild(carYear);
}
function buildCtrl(n, data, ctrl){
for(var i = 0; i< vehicleData.length; i++){
if(uniqueNames.indexOf(vehicleData[i].year) === -1){
    uniqueNames.push(vehicleData[i].year);        
}
}
 for(i = 0; i< uniqueNames.length; i++){    
console.log(uniqueNames[i]);      
}
var item = document.createElement(ctrl);
if(data){
    item.innerHTML = data[n];
}
return item;
}

输出后，下拉列表中将显示未定义。我想要从年份部分[从json数据]的下拉列表中的唯一值。

我的plunker代码是：http://plnkr.co/edit/fMufqCctzHe4Umbpu6Ag?p=preview

这里有几个问题，一旦你开始制作其他下拉菜单，这些问题只会变得更糟，你应该总是尽可能多地抽象，这样你就可以反复使用你的功能：

这在一个功能中实现了您想要的功能：新的PLUNKER

var vehicleData = [{year: 2015, make: "Audi", model: "A4"},
    {year: 2014, make: "Benz", model: "c2000"},
    {year: 2016, make: "Maruti", model: "s-cross"},
    {year: 2015, make: "Maruti", model: "WagonR"}
];
function buildDD(id){
  var selector = document.getElementById(id);
  var newDataArray = vehicleData.map(function(d) {
    return d[id]
  })
  var uniques = newDataArray.reduce(function(a, b) {
    if (a.indexOf(b) === -1) {
      a.push(b);
    }
    return a;
  }, []);
  uniques.forEach(function(el) {
    var opt = document.createElement('option');
    opt.innerHTML = el;
    selector.appendChild(opt)
  })
  return newDataArray;
}
buildDD('year')
buildDD('make')
buildDD('model')
相关文章：