html 事件干扰

<style>
.div-content {
overflow: hidden;
}

.div-title {
height: 20px;
width: 160px;
border: 1px solid #eee;
}

.div-content-ul {
width: 165px;
position: absolute;
left: 0;
display: none;
}

.div-content-ul ul {
margin: 0;
padding: 0;
list-style: none;
}

.div-content-ul ul li {
padding: 0 5px;
line-height: 24px;
border-bottom: 1px dotted #ccc;
}
</style>
<div class="div-content">
<div class="div-title"></div>
<div class="div-content-ul">
<ul>
<li><a href="javascript:;" title="快捷搜索" urlparam="">全部数据1</a></li>
<li><a href="javascript:;" title="快捷搜索" urlparam="">全部数据2</a></li>
<li><a href="javascript:;" title="快捷搜索" urlparam="">全部数据3</a></li>
<li class="curr"><a href="javascript:;" title="快捷搜索" urlparam="">全部数据4</a></li>
<li><a href="javascript:;" title="快捷搜索" urlparam="">全部数据5</a></li>
<li><a href="javascript:;" title="快捷搜索" urlparam="">全部数据6</a></li>
</ul>
</div>
</div>

  

$(document).ready(function () {
$('.div-content-ul ul li').click(function () {
$('.div-title').html($(this).text());
$('.div-content-ul').hide();
});
$('.div-content-ul li').each(function () {
if ($(this).hasClass('curr')) {
$(this).trigger('click');
}
});
var t;
$('.div-title').mousemove(function (e) {
clearTimeout(t);
$(this).next('.div-content-ul').slideDown(100);
e.stopPropagation();
}).mouseleave(function (e) {
var f;
$(this).next('.div-content-ul').mousemove(function () {
clearTimeout(f);
}).mouseleave(function () {
clearTimeout(t);
t = setTimeout(function () {
$('.div-content-ul').hide();
}, 100);
});
f = setTimeout(function () {
$('.div-content-ul').hide();
}, 100);
});
});