jQuery延时器jQuery.mouseDelay操作目的是为了防止用户误触发事件,一般情况下鼠标指针小于150毫秒的停留时间都可以被忽略。 jQuery延时器快速划过的操作将会被忽略,同时支持对同类操作进行分组(如:划过下拉菜单面板不会触发按钮离开的事件)
主要js与解析
$(".mainnav li").each(function () {
var e = $(this).find(".sub").find("dd").length
$(this).addClass("has-sub");
$(this).mouseDelay(false).hover(function () {
$(this).find(".sub").slideDown();
$(this).find(".sub").slideUp();
var Unhover = $('#unhover');
Unhover.click(function () {
$(".mainnav li").unbind();
alert("hover事件已经卸载,转换成点击事件!");
$(".mainnav li").each(function () {
var e = $(this).find(".sub").find("dd").length
$(this).find("h3").append("<i class='op'></i>");
var op = $(this).find("h3").find(".op")
$(this).toggleClass("click");
$(this).parent().next(".sub").slideToggle();
$(this).parents("li").siblings().find(".op").removeClass("click");
$(this).parents("li").siblings().find(".sub").slideUp();
<script>
$(".mainnav li").each(function () {
var e = $(this).find(".sub").find("dd").length
if (e >= 1) {
$(this).addClass("has-sub");
$(this).mouseDelay(false).hover(function () {
$(this).find(".sub").slideDown();
}, function () {
$(this).find(".sub").slideUp();
});
}
});
var Unhover = $('#unhover');
// 卸载hover事件
Unhover.click(function () {
$(".mainnav li").unbind();
alert("hover事件已经卸载,转换成点击事件!");
$(".mainnav li").each(function () {
var e = $(this).find(".sub").find("dd").length
if (e >= 1) {
$(this).find("h3").append("<i class='op'></i>");
var op = $(this).find("h3").find(".op")
op.click(function () {
$(this).toggleClass("click");
$(this).parent().next(".sub").slideToggle();
$(this).parents("li").siblings().find(".op").removeClass("click");
$(this).parents("li").siblings().find(".sub").slideUp();
});
}
});
});
</script>
<script>
$(".mainnav li").each(function () {
var e = $(this).find(".sub").find("dd").length
if (e >= 1) {
$(this).addClass("has-sub");
$(this).mouseDelay(false).hover(function () {
$(this).find(".sub").slideDown();
}, function () {
$(this).find(".sub").slideUp();
});
}
});
var Unhover = $('#unhover');
// 卸载hover事件
Unhover.click(function () {
$(".mainnav li").unbind();
alert("hover事件已经卸载,转换成点击事件!");
$(".mainnav li").each(function () {
var e = $(this).find(".sub").find("dd").length
if (e >= 1) {
$(this).find("h3").append("<i class='op'></i>");
var op = $(this).find("h3").find(".op")
op.click(function () {
$(this).toggleClass("click");
$(this).parent().next(".sub").slideToggle();
$(this).parents("li").siblings().find(".op").removeClass("click");
$(this).parents("li").siblings().find(".sub").slideUp();
});
}
});
});
</script>
接口
mouseDelay (speed, group) 速度, 设置延时分组名称 设置延时触发效果. 两个参数都是可选的
mouseDelayPause() [无] 冻结选定元素的延时器
jQuery.mouseDelay.pause (group) 延时分组名称 冻结指定分组的延时器
jQuery.mouseDelay.get () [无] 获取一个不重复的分组名