对于Trigger的用法也百度了解过,目的为了在匹配的元素上触发制定的事件,但是对于这个解释还是模棱两可,下面请帮忙看下代码
这是一个基本的焦点轮播图的js代码
$(".scroll").mouseenter(function() {
if(adTimer){
clearInterval(adTimer);
}
}).mouseleave(function(event) {
adTimer =setInterval(function(){
showImg(index);
index++;
if (index==len) {index=0;};
},3000);
}).trigger('mouseleave');
悬停图片时候clearinterval,
离开图片时触发setinterval
但是关于最后一句.trigger('mouseleave')
实在不明白含义,只知道为了实现开启网页就自动触发计时器,让轮播图开启切换,而不是等待Mouseleave
后再触发事件。
主要的疑问就是在Trigger身上,以及在这里是如何实现的?谢谢各位大神了
整个代码的逻辑是:1.绑定鼠标进入时间;2.绑定鼠标离开事件;3.触发一次鼠标离开事件,即初始化执行setInterval。
这种写法我个人是不大推荐的。我会这样写:
// 对象变量
var $scroll = $('.scroll'),
adTimer = null;
// 事件绑定
$scroll.on({
'mouseenter.scroll': function (e) {
e.preventDefault();
// 清除计时
if (adTimer) {
clearTimeout(adTimer);
}
},
'mouseleave.scroll': function (e) {
e.preventDefault();
// 开始计时
adTimer = setTimeout(function () {
// 执行其他逻辑
// ····
}, 3000);
}
});
// 初始化
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。