1

我已经检查了这个问题。没有答案,这个问题也没有。但我的问题在这里略有不同。我只是在 中添加另一个元素summary并单击该元素而不打开details. 当我在外面点击时,label即只有summary它有效。

这是我的代码:

<form action="#" id="">
        <details>
            <summary>
                <label>Filter 1</label>
            </summary>
            <div class="filter-1">
                <input type="checkbox" name="filter-1" value="a">A <br>
                <input type="checkbox" name="filter-1" value="b">B
            </div>
        </details>
    </form>

我基本上是想在details-summary标签中显示或隐藏一些输入。

注意:- 类和名称属性就在那里。没有代码。

预期解决方案:

单击摘要标签内的任何内容将打开详细信息。提前致谢

4

1 回答 1

2

label元素阻止点击summary。添加pointer-events: none;到标签或您放入的任何元素summary

label {
  pointer-events: none;
}
<form action="#" id="">
  <details>
    <summary>
      <label>Filter 1</label>
    </summary>
    <div class="filter-1">
      <input type="checkbox" name="filter-1" value="a">A <br>
      <input type="checkbox" name="filter-1" value="b">B
    </div>
  </details>
</form>

于 2020-05-26T05:55:47.423 回答