Heim  >  Artikel  >  Web-Frontend  >  jQuery implementiert den Additions- und Subtraktionseffekt von Warenkorbnummern_jquery

jQuery implementiert den Additions- und Subtraktionseffekt von Warenkorbnummern_jquery

WBOY
WBOYOriginal
2016-05-16 16:09:341744Durchsuche

Wenn wir eine Bestellung für den Online-Einkauf aufgeben, gibt es auf der Webseite normalerweise eine Mengenauswahlsteuerung, die den Käufer dazu auffordert, die Anzahl der zu kaufenden Artikel auszuwählen. Der Entwickler führt diese Steuerung durch, um Feinabstimmungsvorgänge wie das Hinzufügen zu ermöglichen und Subtraktion kann durch Anklicken durchgeführt werden. Selbstverständlich können Sie die Stückzahl auch direkt eingeben. In diesem Artikel werden mehrere gängige Methoden zur Verwendung digitaler Spinner-Spinner zum Implementieren digitaler Additions- und Subtraktionsfunktionen vorgestellt.

Zahlen links und rechts addieren und subtrahieren

Zum Beispiel nutzt JD.com derzeit den Effekt des Addierens und Subtrahierens von Zahlen nach links und rechts bei der Übermittlung von Bestellungen. Dieser Effekt ist unkompliziert und einfach zu bedienen. Wir verwenden das Plug-in jquery.spinner.js, um Zahlen links und rechts zu addieren und zu subtrahieren. Die Aufrufmethode ist sehr einfach.

Code kopieren Der Code lautet wie folgt:


Der Aufruf ist auch sehr einfach. Laden Sie zuerst die jquery-Bibliotheksdatei und jquery.spinner.js und verwenden Sie dann den folgenden Code:

Code kopieren Der Code lautet wie folgt:
$('.spinner').spinner();

Bootstrap-Stil, Plus und Minus auf der rechten Seite

Bootstrap ist seit langem beliebt und es gibt viele Arten von Anwendungen, die auf dem Bootstrap-Stil basieren. Lassen Sie mich Ihnen ein digitales Additions- und Subtraktions-Plug-In vorstellen, das den Minimalwert und den Maximalwert festlegen kann , erhöhen und verringern (Schrittwert) und geben Sie die Zahlen manuell ein.

Code kopieren Der Code lautet wie folgt:





Nachdem Sie die Bootstrap-bezogenen CSS- und JS-Dateien geladen haben, können Sie den Seiteneffekt direkt sehen. Wenn Ihr Projekt auf Bootstrap basiert, können Sie es direkt aufrufen. Bitte sehen Sie sich Demobeispiel 2 an
Sie können sich auch auf die Projektadresse beziehen:
https://github.com/xixilive/jquery-spinner
, um relevante Parametereinstellungen anzuzeigen.

jQuery-UI-Stil, Addition und Subtraktion auf der rechten Seite
jQuery ui bietet außerdem ein Plug-in zum Addieren und Subtrahieren von Zahlen, mit dem der Minimalwert, der Maximalwert, das Inkrementieren und Dekrementieren (Schrittwert) sowie die manuelle Eingabe von Zahlen festgelegt werden können. Bitte sehen Sie sich Demobeispiel 3 an

Code kopieren


Der Code lautet wie folgt: Wenn Ihr Projekt JQuery UI verwendet, können Sie JQuery UI aufrufen, um die Funktion zum Addieren und Subtrahieren von Zahlen zu implementieren.


Code kopieren

Der Code lautet wie folgt:



Das Obige ist der gesamte in diesem Artikel beschriebene Inhalt. Ich hoffe, dass er Ihnen gefällt und Ihnen dabei hilft, jQuery zu meistern.
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn