Wie kann man auf bestimmte Klickereignisse achten, andere jedoch unterdrücken?
P粉199248808
P粉199248808 2024-04-04 16:55:27
0
1
470

Meine Webanwendung enthält eine HTML-Tabelle, in der jede Zeile auf eine bestimmte URL verweist:

<table>
  <tr data-url="https://www.google.com">
    <td>Google</td>
  </tr>
  <tr data-url="https://www.yahoo.com">
    <td>Yahoo</td>
  </tr>
</table>

Das ist das Javascript, mit dem es funktioniert:

const rows = document.querySelectorAll('table tr[data-url]');

rows.forEach(row => {
  row.addEventListener('click', function() {
    handleClick(row);
  });
});

function handleClick(row) {
  const url = row.dataset.url;
  window.document.location = url;
}

Dieser Code funktioniert großartig.

Jetzt möchte mein Kunde, dass ich Kontrollkästchen zu diesen Tabellenzellen hinzufüge. (Ich werde nicht näher darauf eingehen, warum.)

Wie unterdrücke ich die Weiterleitung, wenn das Kontrollkästchen aktiviert ist?

Danke für deine Hilfe.

P粉199248808
P粉199248808

Antworte allen(1)
P粉980815259

您可以检查事件的目标是否不是复选框。

rows.forEach(row => {
  row.addEventListener('click', function(e) {
    if (!e.target.matches('input[type=checkbox]')) handleClick(row);
  });
});
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage