2016-03-25 12 views
2

Brian Reavisの優れたSelectize.jsを使用して、選択した入力に機能を追加しています。selectize select boxでホバーイベントをキャプチャする方法

しかし、ユーザーが選択したオプションの上にマウスを置いたときに、イベントハンドラを追加しようとしています。私は、この種のイベントのためにAPIに記録されたイベントは確認できません。

私はselectizeこの

<div data-value="my value" data-selectable="" class="option">my label</div> 

と、私は、各オプションの上クラスに

クラス=「オプション」= "オプションからクラスの変更を私のマウスを動かすと、そのような独自のdivを作成した見ることができますアクティブ "に戻って再度表示されます。

しかし、私は自分のハンドラをこれらのイベントに追加する方法を見ていません。誰か助けてください。

多くのおかげ

アレック

答えて

3

.selectize-dropdown-content

$('.selectize-control').on('mouseenter', '.selectize-dropdown-content div', function() { 
 
    alert($(this).text()) 
 
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.1/css/selectize.min.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.1/js/standalone/selectize.min.js"></script> 
 

 
<div class="control-group"> 
 
    <select id="select-beast" class="demo-default" placeholder="Select a person..."> 
 
    <option value="">Select a person...</option> 
 
    <option value="4">Thomas Edison</option> 
 
    <option value="1">Nikola</option> 
 
    <option value="3">Nikola Tesla</option> 
 
    <option value="5">Arnold Schwarzenegger</option> 
 
    </select> 
 
</div> 
 
<script> 
 
    $('#select-beast').selectize({ 
 
    maxItems: 3 
 
    }); 
 
</script>

+0

おかげ内側のdivにmouseenterを使用しています。それがまさに私が必要としていたものです。 – user3069804

関連する問題