请考虑以下代码段:
<div class="row">
<div class="col-sm-12">
<div class="form-group form-group-default">
<label>OPTIONS</label>
<div class="checkbox">
<input type="checkbox" id="checkbox2">
<label for="checkbox2">Email</label>
</div>
</div>
</div>
</div>
每当我将鼠标悬停在<div class="checkbox">
上时,<div class="form-group form-group-default">
的焦点事件就会被触发;在css代码中我没有找到<div class="checkbox">
的任何相关悬停代码。
答案 0 :(得分:0)
据我所知,DOM的所有事件都会通过它的父母传播。除非某些事件处理程序停止它。
看看这个例子。
<!-- https://jsfiddle.net/z0ncxhfq/ -->
<div class="parent">
<a class="dontpropagate child" href="#one">Link one</a>
</div>
<div id="dont" class="parent">
<a class="child" href="#two">Link two</a>
</div>
<script>
var elements = document.querySelectorAll(".dontpropagate");
for(var i = 0, len = elements.length; i < len; ++i) {
elements[i].addEventListener("click", stopPropagation, false);
}
function stopPropagation(event) {
event.stopPropagation();
}
</script>
答案 1 :(得分:0)
如果我理解正确,您只需删除表单组样式。
尝试:
.form-group:focus,
.form-group:hover,
.form-group:active {
outline: none !important;
}