Question

我有多个下拉触发器用于相同的下拉内容。

但是，当dropdown-content已经打开时，当我单击另一个dropdown-trigger时，dropdown-content不会显示。我需要单击其他位置以显示下拉菜单内容。

Click here to see the bug（红色圆圈是我点击时的圆圈）

我正在使用Materialize v1.0.0-rc.2

下拉内容

：

int func1(int a) {return a+1;}
long func2(long a) {return a*10;}

vector<int> func1(vector<int> a_vec)
{
    vector<int> out_vec;
    for (int i = 0; i < a_vec.size(); i++)
        out_vec.push_back(func1(a_vec[i]));
    return out_vec;
}

vector<long> func2(vector<long> a_vec)
{
    vector<long> out_vec;
    for (int i = 0; i < a_vec.size(); i++)
        out_vec.push_back(func2(a_vec[i]));
    return out_vec;
}

下拉触发器：

<ul id="user-settings-dropdown" class="dropdown-content">
  <li><a>Tornar Moderador</a></li>
  <li><a>Tornar Mentor</a></li>
  <li><a>Tornar Jogador</a></li>
  <li><a>Tirar Moderador</a></li>
  <li><a>Remover</a></li>
</ul>

Answer 1

好吧，如果您只想保留一个下拉菜单结构，则可以使用hover: true。

<ul id="dropdown1" class="dropdown-content">
    <li>
        <a>Tornar Moderador</a>
    </li>
    <li>
        <a>Tornar Mentor</a>
    </li>
    <li>
        <a>Tornar Jogador</a>
    </li>
    <li>
        <a>Tirar Moderador</a>
    </li>
    <li>
        <a>Remover</a>
    </li>
</ul>
<div class="container">
    <div class="row">
        <div class="col s3">
            <a href="#!">Dropdown1
                <i class="dropdown-trigger material-icons" data-target="dropdown1">arrow_drop_down</i>
            </a>
        </div>
        <div class="col s3">
            <a href="#!">Dropdown2
                <i class="dropdown-trigger material-icons" data-target="dropdown1">arrow_drop_down</i>
            </a>
        </div>
        <div class="col s3">
            <a href="#!">Dropdown3
                <i class="dropdown-trigger material-icons" data-target="dropdown1">arrow_drop_down</i>
            </a>
        </div>
        <div class="col s3">
            <a href="#!">Dropdown4
                <i class="dropdown-trigger material-icons" data-target="dropdown1">arrow_drop_down</i>
            </a>
        </div>
    </div>
</div>
<script>
    $(document).ready(function () {
        $(".dropdown-trigger").dropdown({
            hover: true
        });
    });
</script>

多个下拉触发器未打开下拉内容

1 个答案: