2016-08-05 67 views
1

我有一个带有数据列表的文本输入。此数据列表充满活力与PHP:Javascript:根据输入匹配数据列表选项

<input type="text" name="city" list="cities" id="city"> 
    <datalist id="cities"> 
     <?php 
     foreach($cities as $city){ 
     echo '<option value="'.$city.'" />'; 
     } 
     ?> 
    </datalist> 
</input> 

有一种简单的方法来存储在一个javascript阵列中的所有数据列表的选择吗?

编辑:

或者更好:有没有一种方法来检查使用JavaScript如果输入字段中的文本是在数据列表的选项?

回答

1

回答你“或更好的部分”

,你问,无须转换为JSON数组这应该是很容易做到这一点只在JavaScript并运行JavaScript匹配。

附加一个示例代码片段。以下是用于检查输入中的值是否与任何选项匹配的示例。

下面是它在输入的每个键盘上的功能,它检查数据列表中是否有与输入的用户输入相匹配的选项。您可以更改过滤器功能的return部分以进行任何类型的匹配。

$("#city").on('keyup',function(e){ 
 
    var option = $('#cities option').filter(function() { 
 
     return this.value === $("#city").val(); 
 
    }).val(); 
 
    
 
    if(option) $("#output").html("Match Found:"+ option) 
 
    else $("#output").html(""); 
 
});
#output{ 
 
    margin-top: 30px; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<input type="text" list="cities" id="city"> 
 

 
<datalist id="cities"> 
 
    <option value="Volvo"> 
 
    <option value="Saab"> 
 
    <option value="Mercedes"> 
 
    <option value="Audi"> 
 
</datalist> 
 

 
<span id="output"></span>

2

是的,有:

var cities = <?=json_encode($cities)?>; 
相关问题