Блог

Главная - Вопросы по программированию - jQuery mousedown находит точный элемент, при котором запускается событие

jQuery mousedown находит точный элемент, при котором запускается событие

#jquery #mouseevent

#jquery #mouseevent

Вопрос:

Привет, у меня есть этот HTML-код 

 <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>

и имеет этот JS-код 

   $("Table tr th").mousedown(function (e) {  
    /*mousedown code goes here... */
    /* ignore if mousedown occur on div "some-handle" */
  }

Теперь я пытаюсь отследить, происходит ли mousedown в div, имеющем класс «some-handle».
могу ли я это сделать?

Ответ №1:

Проверьте e.target . Это элемент, из которого возникло событие.

 if ($(e.target).hasClass('some-handle')) {
    // fired on div "some-handle"
}

Комментарии:

1. Извините — это НЕ ответ на ваш вопрос. Вы спросили, как предотвратить то, что происходит при нажатии на элемент с этим классом.

2. блестящий ответ, не знал, что событие будет отображаться даже на дочерних элементах!

3. @anasnakawa хотя ваш комментарий о коде верен, ответ, принятый OP здесь, вообще неверен. openidsujoy сообщает «игнорировать», когда объект получает событие mousedown. Так что, ИМХО, это не решает проблему. Вы даже не могли бы поставить else , потому что это сработало бы для всего, и это тоже неверно.

4. @T9b Вопрос в том, как найти точный элемент, при котором было запущено событие. Это e.target . Я не совсем уверен, чего хочет OP (вопрос вряд ли ясен), но решение почти наверняка будет включать e.target . Мой код работает с предоставленным HTML.

5. @lonesomeday Я согласен, что спрашивающий не прояснил и также спросил, как идентифицировать наведение курсора мыши на элемент с классом. Но я хочу сказать, что /* ignore if mousedown occur on div "some-handle" */ это не то же самое, что // fired on div "some-handle" , и мой аргумент заключается в том, что даже если он может идентифицировать событие из вашего кода — это было бы бесполезно, потому что ему на самом деле нужно обработать что-то еще. Я хотел бы, чтобы OP ответил на это обсуждение и ответил, как он смог использовать ваш код, чтобы «игнорировать» событие, которое было запущено, или же он должен выбрать другой ответ.

Ответ №2:

Вы можете сделать что-то вроде этого 

   $("Table tr th").mousedown(function (e) {   

       if ($(this).hasClass('some-handle')) { 
        // ignore
        return False;
        }
        /*mousedown code goes here... */ 
      }

Ответ №3:

что вам нужно сделать, так это сохранить значение в, th когда мышь находится над вашим some-handle div, а затем проверить это значение, когда мышь находится над th элементом:

 $("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);
    }
);

Ответ №4:

Я думаю, у вас возникли проблемы, потому что у вас есть ссылка, вложенная в ваш <DIV> . Я подозреваю, что щелчок по ссылке приведет к переопределению вашего кода.

Поэтому вам необходимо обработать щелчок, прежде чем внедрять код:

 $("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... */          
    }
});