2017-05-31 15 views
0

私はこのドロップダウンメニューをブートストラップを使って作っています。問題は、その内部をクリックするか、その内部のチェックボックスをチェックすると、自分自身を隠すことです。ドロップダウンの外側のどこかをクリックしない限り、クローズしないようにするにはどうすればよいですか。 ありがとうございます!ドロップダウンリストを非表示にしないでください。

<div class="ibox-tools"> 
    <a class="dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="true"> 
     <i class="fa fa-line-chart"></i> 
    </a> 

    <ul class="dropdown-menu dropdown-user" style="width:200px"> 
     @foreach(PKG_VLTROUTINE_GET_EXCHAGEINFO_Result cur in Model) 
     { 
      <li style="padding:5px"> 
       <strong>@cur.VLTNAME</strong> 
       &nbsp;@cur.RATE 
       <br /> 
       <small>@cur.VLTFULLNAME</small> 
       <small> 
        (
        @cur.RATEDIF 
        @if (cur.DIRECTION == 1) 
        { 
         <i style="color:#1ab394" class="fa fa-level-up text-navy"></i> 
        } 
        else 
        { 
         <i style="color:#ed5565" class="fa fa-level-down text-navy"></i> 
        } 
        ) 
       </small> 
       <div class="MsSwitch MsSwitch-update"> 
        <input data-evoldvall="-1" value="-1" type="checkbox" checked="" data-valtrue="-1" data-valfalse="" name="@cur.VLTNAME" class="evCheckBox"> 
        <label for="@cur.VLTNAME"></label> 
       </div> 
       <li class="divider" style="margin:0px"></li> 
      </li> 
     } 
    </ul> 
+1

](https://stackoverflow.com/questions/25089297/twitter-bootstrap-avoid-dropdown-menu-close-on-click-inside) – Jiro90

+1

これが役立つかもしれないhttps://stackoverflow.com/questions/25089297/ twitter-bootstrap-avoid-drop-menu-close-on-click-inside –

答えて

1

データ属性data-toggle = "dropdown"を削除し、ドロップダウンのオープン/クローズを実装してジョブを実行できます。 ファーストは、このようにドロップダウンを閉じる/開くためのリンクをクリックして処理します。

$('a.dropdown').on('click', function() { 
$(this).parent().toggleClass('open'); 
}); 

次に、このようにそれを閉じるためにドロップダウンの外でクリックを待つ:[これを参照してください

$('body').on('click', function (e) { 
if (!$('a.dropdown').is(e.target) && $('a.dropdown').has(e.target).length === 0 && $('.open').has(e.target).length === 0) { 
$('a.dropdown').parent().removeClass('open'); } }); 
関連する問題