In diesem Artikelbeispiel wird der spezifische JS-Code zur Implementierung von Warenkorb-Addieren, -Subtrahieren und Preisberechnungen zu Ihrer Information geteilt. Der spezifische Inhalt ist wie folgt Implementierte Hauptfunktionen: Addition und Subtraktion des Einkaufswagens, Berechnung des Preises einzelner Artikel, Berechnung des Gesamtpreises. Die Preise werden auf zwei Dezimalstellen gerundet. <div Klasse="Inhalt"> <div Klasse="Logo"> <img src="images/dd_logo.jpg"><span onclick="guan()">Schließen</span> </div> <div Klasse = "cartList" id = "zong"> <ul> <li >¥ 21,90</li> <li><input type="button" name="minus" value="-" onclick="jian()"><input type="text" name="amount" value="1" id="shang"><input type="button" name="plus" value="+" onclick="jia()"></li> <li>¥<input type="text" name="price" value="21.90" id="yiqian"></li> <li><p onclick="shou()">Zu Favoriten verschieben</p><p onclick="shan()">Löschen</p></li> </ul> <ul> <li >¥ 24,00</li> <li><input type="button" name="minus" value="-" onclick="jian1()"><input type="text" name="amount" value="1" id="shang1"><input type="button" name="plus" value="+" onclick="jia1()"></li> <li>¥<Eingabetyp="Text" Name="Preis" Wert="24,00"id="erqian" ></li> <li><p onclick="shan()">Zu Favoriten verschieben</p><p onclick="shan()">Löschen</p></li> </ul> <ol> <li id="Gesamtpreis" > 0,00</li> <li><span onclick="jie()">Zur Kasse</span></li> </ol> </div> <h3 id="shijian">Jetzt ist:</h3> </div> Das Obige ist die HTML-Seite Das Folgende ist das JS-Skript var Preis = 0,00; var Preis1 = 0,00; var Preis2 = 0,00; Funktion jian() { var i = parseInt(document.getElementById("shang").valueOf().value) - 1; wenn (i <= 0) { ich = 0; } document.getElementById("shang").valueOf().value = i; Preis1 = 21,90 * i; document.getElementById("yiqian").value=suan(Preis1); zong(); } Funktion jia() { var i = parseInt(document.getElementById("shang").valueOf().value) + 1; document.getElementById("shang").valueOf().value = i; Preis1 = 21,90 * i; document.getElementById("yiqian").value=suan(Preis1); zong(); } Funktion jian1() { var i = parseInt(document.getElementById("shang1").valueOf().value) - 1; wenn (i <= 0) { ich = 0; } document.getElementById("shang1").valueOf().value = i; Preis2 = 24,00 * i; document.getElementById("erqian").value=suan(Preis2); zong(); } Funktion jia1() { var i = parseInt(document.getElementById("shang1").valueOf().value) + 1; document.getElementById("shang1").valueOf().value = i; Preis2 = 24,00 * i; document.getElementById("erqian").value=suan(Preis2); zong(); } Funktion suan(Zahl) { Preis = Preis1 + Preis2; wenn (istNaN(Zahl)) { gibt false zurück; } Zahl = Math.round(Zahl * 100) / 100; var s = Zahl.toString(); var rs = s.indexOf("."); wenn (rs < 0) { rs = s.Länge; s += "."; } während (s.Länge <= rs + 2) { s += "0"; } Rückgabe s; } Funktion zong() { Preis = Preis1 + Preis2; wenn (isNaN(Preis)) { gibt false zurück; } Preis = Math.round(Preis * 100) / 100; var s = Preis.toString(); var rs = s.indexOf("."); wenn (rs < 0) { rs = s.Länge; s += "."; } während (s.Länge <= rs + 2) { s += "0"; } document.getElementById("Gesamtpreis").innerHTML=s; } Es wird die grundlegendste Methode verwendet, die für Anfänger leicht zu verstehen ist und insbesondere für diejenigen mit Wissensdefiziten grundsätzlich verständlich ist. Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
>>: Detailliertes Tutorial zum Bereitstellen eines Django-Projekts unter CentOS
Mindmap Er sieht wahrscheinlich so aus: Die meist...
1. Erstellen Sie einen neuen Benutzer wwweee000 [...
Inhaltsverzeichnis Was ist das Linux-System, das ...
Das Clustering ist eigentlich relativ zur InnoDB-...
Inhaltsverzeichnis VMware BurpSuite 1. Virtuelles...
Zusammensetzung der Tabellenbeschriftung Die Tabe...
Zuerst müssen Sie Vue-cli installieren: npm insta...
Und hier nun ohne weitere Umschweife die Renderin...
1. Nachfrage Der lokale Testdomänenname ist derse...
Code kopieren Der Code lautet wie folgt: .sugLaye...
Ich bin in letzter Zeit auf viele Zentrierungspro...
Inhaltsverzeichnis 1. Document.execCommand()-Meth...
Vor Kurzem habe ich mit shake.js eine ähnliche Fu...
1.1 Einführung in die iptables-Firewall Netfilter...
Vorwort In letzter Zeit haben viele neue Kollegen...