ブートストラップコンボボックスと入力後に値を選択

Question

私はbootstrap comboboxプラグインを使用しています。

コンボのNewYorkから選択するとうまくいきますが、Newを入力してメニューからNew Yorkを選択しようとすると機能しません。

例はhereです。

Answer 1

は試してみてください。この：

Demo fiddle変更changeイベント

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

代替イベントclickから

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/

0123を

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>