Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden. Du solltest ein Upgrade durchführen oder ein alternativer Browser verwenden.
Einen schönen guten Tag an alle, die das Lesen. In meiner Freizeit übe ich gerne das erstellen von Webseiten und konnte mir bis jetzt zum Glück immer selber helfen, Jetzt bin ich aber blöderweise an den Punkt gekommen, wo ich nicht weiterkomme. Unzwar habe ich einen Einkaufswagen, der Anzahl, wie Preis der Elemente im Warenkorb berechnen soll. Dies habe ich gemacht in dem ich die Elemente in den Einkaufswagen gesetzt habe und mit "display: none" versteckt habe. Bei klick soll auf das jeweilige Produkt soll die "aktiv" Klasse erscheinen, sodass das Display auf "flex" gesetzt wird. So kann ich nur jedes Produkt einmal hinzufügen, während bei jedem weiteren "hinzufügen" click weiterhin die Anzahl und Preis erhöht werden. Zudem werden nach mehrmaligen Additionen viele Nachkommastellen angezeigt. Kennt ihr einen Weg wie ich ein Produkt mehrmals hinzufügen, also das es sich automatisch dupliziert? Wisst ihr auch wie ich die Nachkommastellen auf max 2 stk runterbekomme (aus "14.950000000000001" = 14.95)?
Super! Danke für deine schnelle Antwort. Ich habe deine Zeilen jetzt so eingefügt. Wahrscheinlich stelle ich mich da ein bisschen doof an aber so wie ich das übernommen habe, funktioniert es noch nicht. Kannst du mir da bitte ein paar Tipps zu geben?
Javascript:
let suchLeiste = document.querySelector('.such-leiste');
let summe1 = 2.99;
let summe2 = 2.99;
let summe3 = 1.99;
let summe4 = 2.49;
let summe5 = 2.99;
let summe6 = 2.49;
let zwischenSumme = 0;
let i = 0;
const formatter = new Intl.NumberFormat('de-DE', {
style: 'currency',
currency: 'EUR',
// round to whole numbers
//minimumFractionDigits: 0,
//maximumFractionDigits: 0,
});
formatter.format(2500); // "2.500,00 €"
formatter.format(.99); // "0,99 €"
formatter.format(14.950000000000001); // "14,95 €"
document.querySelector('#such-btn').onclick = () =>{
suchLeiste.classList.toggle('aktiv');
}
let cartList = document.querySelector('.cart-items-container');
document.querySelector('#wagen-btn').onclick = () =>{
cartList.classList.toggle('aktiv');
}
let headerLeiste = document.querySelector('.header-leiste');
document.querySelector('#menu-btn').onclick = () => {
headerLeiste.classList.toggle('aktiv');
}
let produkt1 = document.querySelector('.cart-items1')
document.querySelector('#p1').onclick = () => {
i++;
document.querySelector('.anzahl').innerHTML = i;
produkt1.classList.add('aktiv');
zwischenSumme = zwischenSumme + summe1;
document.querySelector('.gesamtpreis').innerHTML = zwischenSumme;
}
let produkt2 = document.querySelector('.cart-items2')
document.querySelector('#p2').onclick = () => {
i++;
document.querySelector('.anzahl').innerHTML = i;
produkt2.classList.add('aktiv');
zwischenSumme = zwischenSumme + summe2;
document.querySelector('.gesamtpreis').innerHTML = zwischenSumme;
}
let produkt3 = document.querySelector('.cart-items3')
document.querySelector('#p3').onclick = () => {
i++;
document.querySelector('.anzahl').innerHTML = i;
produkt3.classList.add('aktiv');
zwischenSumme = zwischenSumme + summe3;
document.querySelector('.gesamtpreis').innerHTML = zwischenSumme;
}
Achso, jetzt verstehe ich das. Jetzt funktioniert alles erste Sahn. Vielen Dank, freue mich wie ein kleines Kind das ich das jetzt dank deiner Hilfe fertig stellen konnte. Anstatt zu versuchen dasselbe Produkt bei mehrmaligen klicken zu duplizieren, sodass man sieht wie oft das Produkt im Warenkorb liegt kann ich ja einfach eine Anzahl unter dem Produkt anzeigen lassen wie oft es schon im Warenkorb ist. Nochmals danke Sie sind der Wahnsinn!