引导工具提示没有关闭.checkbox-inline和.radio-inline标签，内部禁用复选框/收音机问题

Question

更新：看起来mouseleave事件不会在标签包装器上触发，这就是工具提示所寻找的内容。

从这里的例子可以看出我的问题：

https://jsfiddle.net/bjvosa6h/

基本上我有一些禁用的复选框/无线电输入包装在一个标签（.checkbox-inline / .radio-inline）中，当我从右到左悬停在chexkbox / radio上时，所有工具提示都保持活动状态。

<label class="checkbox-inline" title="Tooltip content..." data-toggle="tooltip">
  <input type="checkbox" value="1" disabled> 1
</label>

不确定这是一个Bootstrap错误还是Chrome中的事件传播？似乎无法获得良好的解决方法。有什么想法吗？

Answer 1

默认情况下，工具提示会附加到class Foo extends Component { constructor(props) { super(props); this.state = { check : true }; } componentWillMount() { console.log(this.props.params.id); } render() { //... } } 。如果将其设置为hover focus，则应按预期工作。更新了JSFiddle：https://jsfiddle.net/bjvosa6h/14/

Answer 2

此css规则将通过允许从禁用的输入传播事件来解决问题（Chrome会阻止已禁用输入的游标事件），因此父标签元素会接收它。

.checkbox-inline > [disabled], .radio-inline > [disabled] {
    pointer-events: none;
}