基础 - 单击“选择标签”时,请防止下拉列表关闭



我正在使用开箱即用的基础下拉列表,我有一个选择标签,以便用户可以选择一种语言。

但是,当用户单击"选择标签基础"下拉菜单时,不允许他们选择语言。

因此,理想情况下,我希望他们能够选择一个国家和语言,然后当它们单击按钮以关闭菜单时,显然这会引起页面的刷新。

我研究了文档中使用aria-autoclose attry,但我无法转过头。

  <li>
  <a href="">
      UK
      <i class="icon-arrow_down"></i>
  </a>
  <ul class="menu country-selector">
      <li class="country-selector__item">
        <h6 class="country-selector__heading">Your Country</h6>
        <select name="" id="" aria-autoclose="false">
            <option value="">Germany</option>
            <option value="">United Kingdom</option>
            <option value="">France</option>
            <option value="">Spain</option>
            <option value="">Belgium</option>
        </select>
      </li>
      <li class="country-selector__item">
        <h6 class="country-selector__heading">Your Language</h6>
        <select name="" id="" aria-autoclose="false">
            <option value="">German</option>
            <option value="">English</option>
            <option value="">Italiano</option>
            <option value="">Dansk</option>
            <option value="">Norsk</option>
        </select>            
      </li>
      <li class="country-selector__item">
        <button type="submit" class="small expanded button" aria-autoclose="true">CHANGE</button>
      </li>
  </ul>

让我知道我是否需要更好地解释任何内容。

/* 
* Language Select Tag
*/
$('.country-selector select').on('click', function(event) {
    event.stopPropagation()
})

我只需要阻止事件在我想关闭的元素上冒泡,其他任何人都想知道该怎么做

最新更新