Sharing solutions to jQuery.trigger() triggering hover and other events

Baidu has also learned about the usage of Trigger. The purpose is to trigger the specified event on the matching element. However, the explanation is still ambiguous. Please help to look at the code below.

This It is a basic js code for focus carousel

 $(".scroll").mouseenter(function() {             if(adTimer){
             clearInterval(adTimer);
             }
     }).mouseleave(function(event) {
             adTimer =setInterval(function(){
                 showImg(index);                 index++;             if (index==len) {index=0;};
             },3000);
     }).trigger('mouseleave');

hover

pictureclearinterval when leaving the picture, setinterval is triggered when leaving the picture

But about the last sentence.trigger('mouseleave ') I really don't understand the meaning. I just know that in order to automatically trigger the timer when opening the web page, let the carousel image switch, instead of waiting for Mouseleave before triggering the event.

The main question is about Trigger, and how is it implemented here? Thank you, everyone.

should mean something similar to initialization. It is written in a chain style. The logic of the entire code is: 1. Bind the mouse entry time; 2. Bind the mouse leave event; 3. Trigger a mouse leave event, that is, initialize and execute setInterval.

I personally don’t recommend this way of writing. I would write like this:

// 对象变量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);
    }
});// 初始化$scroll.trigger('mouseleave.scroll');

 $(".scroll").mouseenter(function() {             if(adTimer){
             clearInterval(adTimer);
             }
     }).mouseleave(function(event) {
             adTimer =setInterval(function(){
                 showImg(index);
                 index++;             if (index==len) {index=0;};
             },3000);
     });
     $(".scroll").trigger('mouseleave');

I think this way, you will understand better that

trigger does not require an event to occur at your place, but automatically executes the event. Custom events must be triggered by trigger.

The above is the detailed content of Sharing solutions to jQuery.trigger() triggering hover and other events. For more information, please follow other related articles on the PHP Chinese website!