Geek asks and answers

How to trigger a mouseenter event programmatically through jquery

In my html structure, I have one anchor tag element that has an attached hoverIntent anchor event.

     $('a').hoverIntent(function(event){// some code to show popup;})

Whenever I am on the anchor tag manually, it makes some kind of ajax call and returns data from the service and shows a popup.

I want to call mouseenter / hover / mousemove (all that a popup can bring out) from the code (without any manual action)

I tried basic jquery functions like

   $('selector').trigger('hover') and
   $('selector').trigger('mouseenter')

But nothing worked, is it possible to call the hover / mouseenter function without interrupting the user?

+4
source share
8 answers

hoverIntent jQuery mouseenter mousemove, , . mouseenter, - .

mouseenter . mousemove, .

jsbin . " ", , . , , "hover me" . , , :

var e = $.Event('mouseenter');
e.pageX = 50;
e.pageY = 50;
$("#testing").trigger(e);

var e2 = $.Event('mousemove');
e2.pageX = 50;
e2.pageY = 50;
$("#testing").trigger(e2);
+6

. :

$('a').hoverIntent(function(event){// some code to show popup;})

:

function myFunc(event){// some code to show popup;}

$('a').hoverIntent(myFunc);

myFunc , , "" DOM.

+1

, , "mouseenter". , ?

$('selector').mouseenter();
+1

. .

function doThat(event){
    // do some stuff
}

$('a').hoverIntent(doThat);

, , doThat().

0

ajax ? hoverIntent, , - ?

0

I do not know, I think that you really can run mouseenter. It may be more useful for

$('selector').bind('focus', function(e) {
 //code
});

//Then do
$('selector').focus();
0
source

The correct way to execute the jQuery hover function is as follows

$('selector').hover(
    function(){ //This function is called on mouseenter();
        //code
    },function(){ //This function is called on mouseleave();
        //code
});
0
source

Without jQuery hooks, you can always get a browser, fully simulating an event:

var evt = document.createEvent('MouseEvents');
evt.initMouseEvent( 'mouseenter', false, false, window,
                    0, 1, 2, 3, 4,
                    false, false, false, false, 0, null );
$('selector')[0].dispatchEvent(evt);

// or, for multiple matched
$('selector').each(function(){ this.dispatchEvent(evt); });

See the documentation forinitMouseEvent() more details .

0
source

More articles:


All Articles