jquery изменить цвет фона тд при нажатии на пустую часть

Question

Я работаю над проектом управления событиями. Я создал событие за 1 день. Я хочу изменить цвет фона td только тогда, когда пользователь нажимает на пустую часть. Если они нажмут на div события, цвет фона не изменится.

$(document).on("click", "td", function() { 
  $(this).css("background-color", "lightblue");
});

Если я нажму на событие, цвет фона изменится. Я хочу, чтобы это изменилось только при нажатии на пустую часть.

Answer 1

Для этого вы можете проверить, что event.target соответствует элементу, с которым связано событие. Попробуйте это:

$(document).on("click", "td", function(e) {
  if (e.target == this)
    $(this).css("background-color", "lightblue");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td>
      Click me and the BG will change
      <div>Click me and it won't</div>
    </td>
  </tr>
</table>