js实现的tab轮播，鼠标放上去不会静止下来，还会继续轮播，当鼠标放上去如何静止

FineReport 我乃牛马小兵 发布于 2021-9-15 16:56

1min目标场景问卷

立即参与

回答问题关注问题

悬赏：3 F币 + 添加悬赏

提示：增加悬赏、完善问题、追问等操作，可使您的问题被置顶，并向所有关注者发送通知

共2回答

最佳回答

我乃牛马小兵Lv5初级互助
发布于2021-11-8 10:10

function show() {                                //要把这个定时器封装在一个函数里面，否则下面clearInterval以后，再调用会undefined
    window.timer = setInterval(function() {
        var aa = _g().getWidgetByName("tabpane0").getShowIndex();
        if (aa == 2) {
            _g().getWidgetByName('tabpane0').showCardByIndex(0);
        } else {
            _g().getWidgetByName('tabpane0').showCardByIndex(aa + 1);
        }
    }, 2000); //轮播间隔
}                                               //轮播的js
show();
setTimeout(function() {
    $('[widgetname="TABLAYOUT0"]').mouseover(function() {
        clearInterval(timer);
    })
    $('[widgetname="TABLAYOUT0"]').mouseleave(function() { //鼠标事件的对象是整个tab块
        show();
    })
}, 1000)                                       //鼠标移动到窗口对象时，清除定时器，移出时，重新执行show函数，创建定时器开始轮播
window.onresize = function()
{
if (window.timer) {
clearInterval(timer);
show();
}
}                                                  //常用处理，为了防止窗口大小改变时，轮播速度越来越快