jquery - BootstrapJS なしで動作するように JQuery 選択スタイルの UL を変更する

Question

私のプロジェクトでは、JQuery 1.7.2 と JQuery-UI を使用しています。

この select-style UL を Bootstrap.JS なしで動作するように変更したいと思います: Select-style ul

Bootstrap の依存関係を削除し、ここで実験しています: Modified select-style ul

次の JQuery を追加して、ul メニューの表示と非表示を切り替え、元の機能を模倣しました。

$(".select-list .dropdown-menu").hide();
$(".select-list").click(function () {
    $(".select-list .dropdown-menu").show();
})

何かが選択されたとき、またはユーザーがメニューの外をクリックしたときに、UL を再び hide() するにはどうすればよいですか?

Answer 1

あなたは試すことができます：

$(".select-list .dropdown-menu").hide();
$(".select-list").click(function () {
    $(".select-list .dropdown-menu").show();
});
$(".select-list .dropdown-menu").mouseleave(function(){
    $(this).hide();
});