Question

我正在使用开箱即用的基础下拉菜单，我有一个选择标记，以便用户可以选择一种语言。

但是，当用户点击选择标记基础时，下拉菜单会关闭，不允许他们选择语言。

理想情况下，我希望他们能够选择一个国家/地区和语言然后当他们点击按钮然后关闭菜单时，显然这将导致刷新页面。

我已经研究过在文档中使用aria-autoclose attr，但我不知道如何或在何处使用它。

  <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>

如果我需要以更好的方式解释任何事情，请告诉我。

Answer 1

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

我只是需要阻止事件冒泡我不想关闭的元素，其他人想知道如何做到这一点

基础 - 单击选择标记时防止关闭下拉列表

1 个答案: