Bearbeitung mit Neuberechnung in einem Produktrechner in JavaScript
Lassen Sie uns nun die Funktion allowEdit so erweitern,
dass die in der vorherigen Lektion beschriebene
Neuberechnung durchgeführt wird.
An diesem Punkt sollte Ihr Code für die Funktion in etwa so aussehen:
function allowEdit(td) {
td.addEventListener('dblclick', function() {
let text = td.textContent
td.textContent = '';
let input = document.createElement('input');
input.value = text;
input.focus();
td.appendChild(input);
input.addEventListener('keydown', function(event) {
if (event.key == 'Enter') {
td.textContent = this.value;
}
});
});
}
Fügen wir Code hinzu, der für die Zelle mit dem Preis und die Zelle mit der Menge eine Neuberechnung durchführt:
function allowEdit(td) {
td.addEventListener('dblclick', function() {
let text = td.textContent
td.textContent = '';
let input = document.createElement('input');
input.value = text;
input.focus();
td.appendChild(input);
input.addEventListener('keydown', function(event) {
if (event.key == 'Enter') {
td.textContent = this.value;
if (td.classList.contains('price') || td.classList.contains('amount')) {
// führen Sie die Neuberechnung durch
}
}
});
});
}
Ergänzen Sie den fehlenden Teil des Codes so, dass
sich bei einer Änderung der Zelle mit dem Preis oder der Zelle mit
der Menge die Kaufkosten
in der Spalte cost ändern und ebenfalls eine
Neuberechnung der Gesamtsumme durchgeführt wird.