[jQuery] Cancel concurrently running ajax events

[jQuery] Cancel concurrently running ajax events


I have a table with a couple of rows in my web-page. When the user
hovers over an image on each row, an ajax call is fired that gets some
data from the server for that particular row and displays it to the
user in a popup. However, the user may move their mouse very quickly
over the column with the images and generate a whole bunch of ajax
requests running all at the same time. By the way I use $.ajax and
specified async: false, but did not help. How can I cancel the
currently running ajax requests when the mouse triggers the hover
event on a particular row? So that when the user moves their mouse
over a particular row's image it will cancel all other events that are
currently running, does not have to necessarily have to be the same
event type, I'm ok if all other events are stopped/cancelled.