In diesem Artikel wird der spezifische JavaScript-Code zur Implementierung eines einfachen Einkaufsformulars zu Ihrer Information bereitgestellt. Der spezifische Inhalt ist wie folgt HTML Quelltext: <table border="" cellspacing="0" cellpadding="1"> <tr style="Hintergrundfarbe: #0099cc;"> <td><input Typ="Kontrollkästchen" Klasse="alle"/></td> <td style="text-align: center; width: 200px;">Produkte</td> <td style="Farbe: weiß; Breite: 70px; Höhe: 30px; Textausrichtung: Mitte;">Preis</td> </tr> <tr class="zuida"> <td><input Typ="Kontrollkästchen" Klasse="lla"/></td> <td>Apfel</td> <td style="text-align: center;" Klasse="zongji">8000</td> </tr> <tr class="zuida"> <td><input Typ="Kontrollkästchen" Klasse="lla"/></td> <td>Banane</td> <td style="text-align: center;" Klasse="zongji">5000</td> </tr> <tr class="zuida"> <td><input Typ="Kontrollkästchen" Klasse="lla"/></td> <td>Birne</td> <td style="text-align: center;" Klasse="zongji">2000</td> </tr> <tr class="zuida"> <td><input Typ="Kontrollkästchen" Klasse="lla"/></td> <td>Gemüse</td> <td style="text-align: center;" Klasse="zongji">2000</td> </tr> <tr> <td colspan="3">Der Gesamtpreis beträgt: <span class="zongjia">0</span> Yuan</td> </tr> </Tabelle> JQ-Code: <script src="jquery-3.6.0.min.js" type="text/javascript" charset="utf-8"></script> <Skripttyp="text/javascript"> $(Funktion(){ $(".alle").ändern(Funktion(){ var-Wert = $(this).prop("geprüft") $(".lla").prop("überprüft",Wert) zongjia () }) $(".lla").klick(function(){ var chang1=$(".lla").Länge; var chang2=$(".lla:checked").Länge; wenn(ändern1===ändern2){ $(".all").prop("aktiviert",true) }anders{ $(".all").prop("aktiviert",falsch) } zongjia () }) $(".lla").ändern(Funktion(){ zongjia () }) Funktion zongjia(){ var xuan=$(".lla:checked").parents(".zuida"); Variable Nummer = 0; xuan.each(Funktion(Index,ROM){ var xuanzhi=$(rom).find(".zongji").text()*1; Zahl+=xuanzhi; }) $(".zongjia").text(num); } }) </Skript> Bild des fertigen Produkts: 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:
|
<<: Zusammenfassung gängiger Docker-Befehle (empfohlen)
>>: MySQL-Export ganzer oder einzelner Tabellendaten
Methode 1: Um Respin zu verwenden, folgen Sie die...
Sie haben sicher schon einmal die Webseiten andere...
In diesem Artikelbeispiel wird der spezifische Co...
Vor kurzem wollte ich Goaccess verwenden, um Ngin...
Vorwort In den Anfangsphasen einiger Projekte wer...
„Wir schreiben unsere nächste Reihe mobiler Produ...
Inhaltsverzeichnis 01 CMD 02 EINSTIEGSPUNKT 03 AR...
Prämisse In komplexen Szenarien müssen große Date...
Vorwort In diesem Artikel wird erläutert, wie Sie...
Heute werden wir einen einfachen Fall durchgehen ...
CSS-Probleme mit dem Hintergrundverlauf und dem a...
1. Befehlseinführung Mit „time“ werden die für di...
Inhaltsverzeichnis 1. Datenquelle 2. Gesamtrangfo...
In diesem Artikel wird der spezifische Code von J...
1. Es gibt im Allgemeinen zwei Methoden zur Steue...