我有一个问题:当我将鼠标悬停在ul上时,如何删除工具提示元素? 我有这个HTML代码:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<div class="col s12 offset-s4">
<script type="text/javascript">
$(document).ready (function() {
$('select').material_select();
$('select').material_select('destroy');
$('.tooltipped').tooltip({delay: 50});
});
</script>
<a id="tool-new" class="tooltipped" data-tooltip="Please select more than one category" data-position="right" data-delay="120">
<select class="and-or" id="And_Or" name="a_o[]">
<option value="4" selected="selected">And</option>
<option value="5">Or</option>
</select>
</a>
我只想在禁用选择框时将鼠标悬停在工具提示上。但是当selectbox没有被禁用并且工作正常时,请删除该元素以使工具提示无法解决。你可以帮帮我吗?我正在使用materializecss,这是一个非常好的设计框架。
答案 0 :(得分:0)
我在 ul 的mouseover
事件上编写了jQuery。只要鼠标继续 ul ,它就会隐藏工具提示检查代码
$(document).ready (function() {
$('select').material_select();
$('.tooltipped').tooltip({delay: 50});
});
$('select').material_select('destroy');
$('body').on("mouseover",'.dropdown-content', function(){
$("#tool-new").tooltip("hide");
})
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<div class="col s12 offset-s4">
<a id="tool-new" class="tooltipped" data-tooltip="Please select more than one category" data-position="right" data-delay="120">
<select class="and-or" id="And_Or" name="a_o[]">
<option value="4" selected="selected">And</option>
<option value="5">Or</option>
</select>
</a>