在Bootstrap手风琴头中有可点击的元素 [英] Having a clickable element in a Bootstrap accordion header

问题描述

我正在尝试使用手风琴，并在标题内部有一个复选框。但是，当我点击手风琴标题中的复选框时，它会折叠或扩展手风琴。有没有方法可以在没有手风琴展开/折叠的情况下点击复选框？ 点击气泡另一种可能性（除了按照其他人的建议将复选框移到切换之外）是停止冒泡。

使用一些JQuery：

  $（input [type = checkbox]）。on（click，function（event）{
 event.stopPropagation（）; 
}）; 
  

或使用较短的复选框选择器：

<$ （click，function（event）{
event.stopPropagation（）;
}）; pre> $（：checkbox


I'm trying to use an accordion and have a checkbox inside of a header. However, when I click a checkbox in an accordion header, it collapses or expands the accordion. Is there a way to click the checkbox without the accordion expanding/collapsing?

解决方案

The click bubbles up to the accordion header, so another possibility (besides moving the checkbox outside the toggle as suggested by others) is to stop the bubbling.

Use some JQuery like:

$("input[type=checkbox]").on("click", function(event) {
    event.stopPropagation();
});

or with a shorter checkbox selector:

$(":checkbox").on("click", function(event) {
    event.stopPropagation();
});

这篇关于在Bootstrap手风琴头中有可点击的元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！