html - 我在“摘要”标签中有一个“标签”标签。单击标签时不会打开详细信息。怎么解决?
问题描述
我已经检查了这个问题。没有答案,这个问题也没有。但我的问题在这里略有不同。我只是在 中添加另一个元素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
标签中显示或隐藏一些输入。
注意:- 类和名称属性就在那里。没有代码。
预期解决方案:
单击摘要标签内的任何内容将打开详细信息。提前致谢
解决方案
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>
推荐阅读
- javascript - 必应地图上的图钉
- material-ui - 如何设置 FormControlLabel 字体大小的样式
- javascript - 如何查看 HTML、CSS 和 ECMAScript 的历史版本
- c++ - while循环c ++中的非法指令
- tableau-api - 如何仅提取 Tableau 集的 IN 计数
- javascript - 表格和滚动条不刷新
- swift - 从 UIImage 获取 URL 路径 - 框架 ImagePicker
- json - Angular NgRepeat 嵌套的 Json 数据
- ios - 使用泛型进行 Swift json 解析
- r - R Studio `F2` 和 `View()` 产生两种不同的结果