Hover Event is Eratic

[Steve Dyke]

The following code works but is erratic in behavior.

For example if I hover over the aboutobject itself then pull the mouse off of it, it continues to show.

Can you explain what this does? if(e.target == this){}

$('.aboutclass').hover(function(e){
			
			$('.aboutobject').load("/QMSWebApp/LogonControllerServlet",{lifecycle:"aboutformdisplay"});
			$('.aboutobject').show();
			
		},
		function(e){
		
			if(e.target == this){
				$('.aboutobject').hide();
			}
		
		});

[Bear Bibeault]

So I take it that this is code you copied from somewhere? I never recommend that.

The code in question tests whether the element that triggered the event is the same as the element upon which the handler is established.

[Steve Dyke]

Bear Bibeault wrote:So I take it that this is code you copied from somewhere? I never recommend that.

The code in question tests whether the element that triggered the event is the same as the element upon which the handler is established.

Yes I found this code on internet.

So I have a span element(aboutclass) that has the hover event bound to it(using jquery on). This is - the element upon which the handler is established - correct

[Bear Bibeault]

Can't tell without seeing the code. The jQuery .on() method is complex. For example, there could be delegation going on.

[Steve Dyke]

Bear Bibeault wrote:Can't tell without seeing the code. The jQuery .on() method is complex. For example, there could be delegation going on.

Here is the code: Sorry it is hover no on.

$('.aboutclass').hover(function(e){  
             
            $('.aboutobject').load("/QMSWebApp/LogonControllerServlet",{lifecycle:"aboutformdisplay"});  
            $('.aboutobject').show();  
              
        },  
        function(e){  
          
            if(e.target == this){  
                $('.aboutobject').hide();  
            }  
          
        });

[Bear Bibeault]

If I recall correctly, in this case the event target and event function context will be the same element. Set a breakpoint in the functions and compare what e.target and this are set to.