引导组合框，选择键入值

Question

后我使用bootstrap combobox插件。

当您从组合NewYork中选择它可以正常工作，但是如果您键入New，然后尝试从菜单中选择New York，则不起作用。

的例子可以发现here。

Answer 1

试试这个：

Demo fiddle变化change事件click事件

$('.combobox').on('click', function(){ 

备用

应用，如果条件option value

if(option.val()){ 
    alert('Value is ' + option.val()); 
    } 

Demo fiddle

Answer 2

它会没事的工作：

$('.combobox').combobox(); 

var val = '', newVal = null; 

$('.combobox').on('select', function(){ 

    newVal = $(this).val(); 

    if (newVal !== val) { 
     val = newVal; 
     alert('Value is ' + val); 
    } 

}); 

Answer 3

$('#combobox').combobox(); 
 
$('#combobox').on('change', function(){ 
 
\t if($(this).val()){ 
 
     console.log("You selected: "+$(this).val()); 
 
     alert('Value is ' + $(this).val()); 
 
    } 
 
})

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://rawgit.com/danielfarrell/bootstrap-combobox/master/css/bootstrap-combobox.css" rel="stylesheet"/> 
 
<script src="https://rawgit.com/danielfarrell/bootstrap-combobox/master/js/bootstrap-combobox.js"></script> 
 
<div> 
 
    <select class="combobox" id="combobox"> 
 
     <option></option> 
 
     <option value="PA">Pennsylvania</option> 
 
     <option value="CT">Connecticut</option> 
 
     <option value="NY">New York</option> 
 
     <option value="MD">Maryland</option> 
 
     <option value="VA">Virginia</option> 
 
    </select> 
 
</div>

在小提琴还要检查：https://jsfiddle.net/neceegbv/8/

分析这个代码class和id你会看到其中的差别。

Answer 4

您的js小提琴片段是正确的，但有警报函数的问题。所以去除报警功能，并把控制台方法找到选定值象下面片段。

希望可以帮助您。

$('.combobox').combobox(); 
 
$('.combobox').on('change', function(){ 
 
    var option = $(this).find('option:selected'); 
 
\t if(option.length){ 
 
    console.log(option.val()); 
 
    } 
 
});

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://rawgit.com/danielfarrell/bootstrap-combobox/master/css/bootstrap-combobox.css" rel="stylesheet"/> 
 
<script src="https://rawgit.com/danielfarrell/bootstrap-combobox/master/js/bootstrap-combobox.js"></script> 
 
<br><br> 
 
<div class="container"> 
 
\t <div class="row"> 
 
\t \t <div class="col-sm-4"> 
 
\t  <select class="combobox form-control" id="combobox" data-placeholder="Enter City Name"> 
 
\t  \t <option></option> 
 
\t  <option value="PA">Pennsylvania</option> 
 
\t  <option value="CT">Connecticut</option> 
 
\t  <option value="NY">New York</option> 
 
\t  <option value="MD">Maryland</option> 
 
\t  <option value="VA">Virginia</option> 
 
\t  </select> 
 
\t </div> 
 
\t </div> 
 
</div>