引導組合框，選擇鍵入值

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>