jQuery mousedown find exact element on which event get fired
Hi I have this HTML code
<th scope="col" class="" style="width: 13px;">
<div class="some-handle"></div>
<a href="javascript:__doPostBack('ucPWP$ctl03$3056$GVReport','Sort$3')">Passengers</a>
</th>
and have this JS code
$("Table tr th").mousedown(function (e) {
/*mousedown code goes here... */
/* ignore if mousedown occur on div "some-handle" */
}
开发者_开发问答
Now I try to catch if mousedown occur on div having class "some-handle". can I do that ?
Check e.target
. This is the element where the event originated.
if ($(e.target).hasClass('some-handle')) {
// fired on div "some-handle"
}
You can do something like this
$("Table tr th").mousedown(function (e) {
if ($(this).hasClass('some-handle')) {
// ignore
return False;
}
/*mousedown code goes here... */
}
what you have to do, is to store a value on the th
when the mouse is over your some-handle
div, then to check for this value when the mouse is over th
element:
$("Table tr th").mousedown(function (e) {
/*mousedown code goes here... */
/* ignore if mousedown occur on div "some-handle" */
if(!$(this).data('overSomeHandle')) {
// do your code here
}
}
$('.some-handle').hover(
function(){
// we are over some-handle div
$(this).parent().data('overSomeHandle', true);
},
function(){
// we are out of some-handle div
$(this).parent().data('overSomeHandle', false);
}
);
I think you are having trouble because you have a link nested into your <DIV>
. The link click will fire overriding your code I suspect.
Therefore you need to handle the click before you implement the code:
$("Table tr th").mousedown(function (e)
{
e.preventDefault(); //this nullifies the click
if ($(this).hasClass('some-handle'))
{
// ignore
return False;
}else{
/*mousedown code goes here... */
}
});
精彩评论