jQuery: Предотвратить щелчок по классу подэлемента: перенаправить страницу по тр-клику. ЗА ИСКЛЮЧЕНИЕМ некоторых td

Question

Я искал как 30 минут, поэтому прошу прощения, если я уже пропустил этот ответ. Я видел много ЗАКРЫТЫХ, но ничего подобного не было.

У меня есть импортированная функция JavaScript, которая используется в нескольких файлах. Это делает так, чтобы любая таблица, строка которой имеет класс clickable-row, перенаправляет на атрибут href, тем самым делая всю строку действительной, как привязывающий тег.

Однако на некоторых страницах у меня будет td, где будет установлен флажок, который я хочу, чтобы щелкнуть БЕЗ перенаправления страницы (поэтому я могу выбрать несколько строк в таблице).

Вот моя текущая функция:

jQuery(document).ready(function() { 
    jQuery('.clickable-row').click(function() { 
     window.document.location = jQuery(this).attr('href'); 
    }); 
}); 

Я хочу, чтобы сделать что-то вроде следующего, но это не работает:

jQuery(document).ready(function() { 
    jQuery('.clickable-row').click(function() { 
     if(!jQuery(this).closest('td').hasClass('skip-click')) { 
      window.document.location = jQuery(this).attr('href'); 
     } 
    }); 
}); 

Любые идеи о том, как справиться с этим?

Answer 1

Вам необходимо использовать e.target.

this внутри обработчика будет ссылаться на элемент .clickable-row, а не на элемент, который фактически вызвал щелчок. Свойство target для event object вернет элемент, вызвавший событие.

jQuery(document).ready(function ($) { 
    $('.clickable-row').click(function (e) { 
     if (!$(e.target).closest('td').hasClass('skip-click')) { 
      window.document.location = jQuery(this).attr('href'); 
     } 
    }); 
});