2017-02-20 57 views
0

我有一个包含一个简单的数组荷兰城市名称:搜索的数组,而不是唯一的值

var cities = ['Amsterdam', 'Den Haag', 'Den Helder', 'Rotterdam', 'Utrecht', 'Groningen', 'Zoetermeer', 'Zwolle', 'Delft']; 

我的代码通过这个阵列搜索看起来是这样的:

elems.searchField.on('keyup', function(e) { 
    var index, city, result; 
    var currentCity = elems.searchField.val().toLowerCase(); 
    for (index = 0; index < cities.length; ++index) { 
     city = cities[index].toLowerCase(); 

     if (city.indexOf(currentCity) > -1) { 
      result = city; 
      console.log(result); 
      break; 
     } 
    } 
}); 

elems.optionsButton.on('click', function(e) { 
    if (optionButtonState === 0) { 
     elems.consoleItemSecondAndThird.css('display', 'flex'); 
     optionButtonState = 1; 
    } else { 
     elems.consoleItemSecondAndThird.hide(); 
     optionButtonState = 0; 
    } 
}); 

你可以看到两个以“Den”开头的城市,这些是“Den Haag”和“De Helder”。当我输入“Den”时,我需要看到它们都列出,但是,我的代码只查找唯一值,并且只在插入“Den”时显示“Den Haag”。我怎样才能让它显示包含搜索查询的所有值?

+0

你得到结果只有一个,因为你的变量“结果”产生只有一个城市。您可以改为将其用作数组并继续for循环。 like'result.push(city);继续;' – getjackx

回答

4

您可以使用filter()来获取数组,并在过滤器内部使用startsWith()函数。但要注意,startsWith是ES6

StartsWith

var cities = ['Amsterdam', 'Den Haag', 'Den Helder', 'Rotterdam', 'Utrecht', 'Groningen', 'Zoetermeer', 'Zwolle', 'Delft']; 
 

 
console.log(cities.filter(item => item.startsWith('Den')));

为了与旧版本的浏览器可以使用indexOf()功能比较index兼容。

var cities = ['Amsterdam', 'Den Haag', 'Den Helder', 'Rotterdam', 'Utrecht', 'Groningen', 'Zoetermeer', 'Zwolle', 'Delft']; 
 

 
console.log(cities.filter(item => item.indexOf('Den') === 0));

0

使用startsWith和过滤器;你可以在那里太小写值:

elems.searchField.on('keyup', function(e) { 
    return cities.filter(v => v.toLowerCase().startsWith(this.value.toLowerCase()) 
} 
0

使用item.contain("Den")

所以它会给你将在其中找到“巢穴” 任何项目,也可以使用item.startswith("Den")指定只有那些启动项与“书房”

0

你也可以通过使用RegExp

var cities = ['Amsterdam', 'Ajax', 'Den Haag', 'Den Helder', 'Denmark', 'Rotterdam', 'Utrecht', 'Groningen', 'Zoetermeer', 'Zwolle', 'Delft']; 
 

 
function check(arr, query) { 
 
    console.log(cities.filter(v => v.match(new RegExp('^' + query, 'g')))); 
 
} 
 

 
check(cities, 'Den'); 
 
check(cities, 'A');

+0

@erol_smsr考虑upvoting? (: –