2017-06-05 36 views
0

我正在使用物化css。我創建了一個選項卡並將選擇元素放入其中。但是選擇元素後它沒有關閉。我正在使用0.98。實現CSS選擇元素後選擇不關閉

如果我把它放在標籤外,那麼它的工作原理。

這裏是我的代碼:

我Scrtipt

<script> 
     $(document).ready(function(e) { 
      $('ul.tabs').tabs({'swipeable': true}); 
      $("select").material_select(); 
     }); 
    </script> 

HTML代碼:

<div class="main mainContentMargin"> 
      <div class="row"> 
       <!-- This will Work--> 
       <div class="col s12 input-field"> 
        <select id="company_select1" name="company_select1"> 
         <option value="-1" selected>Select Company</option> 
         <option value="1">1</option> 
         <option value="2">2</option> 
        </select> 
        <label>Select Company</label> 
       </div> 
      </div> 
      <div class="row"> 
       <div class="card col s12 medium"> 
        <ul id="tabs-swipe-demo" class="tabs tabs-fixed-width" style="margin-bottom: 1%"> 
         <li class="tab col s6"><a href="#test-swipe-1">To Supplier</a></li> 
         <li class="tab col s6"><a href="#test-swipe-2">Using Product</a></li> 
        </ul> 
        <div id="test-swipe-1" class="col s12"> 
         <!-- This will Work but not closing the dropdown--> 
         <div class="row"> 
          <div class="col s12 input-field"> 
           <select id="company_select" name="company_select"> 
            <option value="-1" selected>Select Company</option>                     
              <option value="1">1</option> 
              <option value="2">2</option> 
           </select> 
           <label>Select Company</label> 
          </div> 
         </div> 
        </div> 
        <div id="test-swipe-2" class="col s12"> 

        </div> 
       </div> 
      </div> 
     </div> 

回答

0

下拉不打烊,因爲我們做標籤滑動瀏覽。這就是爲什麼它的下拉式點擊事件被選項卡捕獲。

我只是在下拉列表中stopPropogation選項設置爲true,它的工作

$(document).ready(function(e) { 
    $('ul.tabs').tabs({'swipeable': true}); 
    $("select").material_select({"stopPropagation":true}); 
});