jQuery определяет, с каким элементом происходит onClick

Question

Я пытаюсь активировать флажок строки таблицы, когда пользователь щелкает внутри строки таблицы.У каждой строки есть флажок.

У меня есть следующий код, который отлично работает как стандартная версия.

$('.scrollTable tr').click(function(event) {
    if(event.target.type !== 'checkbox') {
        $(':checkbox', this).trigger('click');
    }
});

Данные в таблице, к которой я пытаюсь добавить это, имеют различные типыто есть есть изображения, которые создают всплывающие окна, ссылки, которые создают всплывающие подсказки и ссылки, которые перенаправляют на другую страницу.У меня проблема в том, что при нажатии на ссылку, изображение и т. Д. Установлен соответствующий флажок.

Есть идеи?

Answer 1

Распространение - это проблема здесь. Когда вы щелкаете изображение или ссылку, это событие всплывает через предков и запускает обработчик щелчка, когда он достигает элемента <tr>. event.target будет ссылаться на исходный элемент, по которому щелкнули. Вы должны быть более конкретными о "типах", которые вы разрешаете или запрещаете. Например:

$('.scrollTable tr').click(function(event) {
    if(event.target.tagName == 'TD') {
        $(':checkbox', this).trigger('click');
    }
});

Пример запрета <a>, <img> и <input> с использованием карты объектов:

$('.scrollTable tr').click(function(event) {
    var disallow = { "A":1, "IMG":1, "INPUT":1 }; 
    if(!disallow[event.target.tagName]) {
        $(':checkbox', this).trigger('click');
    }
});

Answer 2

это должно работать:

$('.scrollTable tr').click(function(event) {
    var $this = $( event.currentTarget );

    if( $this.is( 'tr' ) )
    {
        $(':checkbox', this).trigger('click');
    }
});

Answer 3

вам, вероятно, нужно обратиться к event.stopPropagation - это должно остановить всплывающее событие до флажка