JavaScript Ürün Hesaplayıcısında Yeniden Hesaplamalı Düzenleme
Şimdi, önceki derste anlatılan yeniden hesaplamanın
yapılması için allowEdit fonksiyonunu
geliştirelim.
Bu noktada, fonksiyonunuzun kodu yaklaşık olarak şu şekilde görünmelidir:
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;
}
});
});
}
Fiyat hücresi ve miktar hücresi için yeniden hesaplama yapacak kodu ekleyelim:
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')) {
// yeniden hesaplama yapalım
}
}
});
});
}
Eksik kısmı, fiyat hücresi veya miktar hücresi
değiştirildiğinde, alışveriş maliyetinin
cost sütununda değişmesi ve ayrıca genel
toplamın yeniden hesaplanması için tamamlayın.