Manchmal müssen wir einen Wertebereich auf der Seite auswählen, z. B. beim Einkaufen einen Preisbereich auswählen, beim Kauf eines Hosts die CPU, die Speichergrößenkonfiguration usw. auswählen. Sie können den intuitiven Schieberegler verwenden, um den direkt auszuwählen Die Eingabe numerischer Werte ist einfach und bequem.
HTML
Laden Sie zunächst die jQuery-Bibliotheksdatei und die mit jRange verbundenen CSS-Dateien: jquery.range.css und das Plug-in: jquery.range.js
Der Aufruf des jRange-Plug-Ins ist sehr einfach, verwenden Sie einfach den folgenden Code:
Code kopieren
Dann starten Sie Ihre Webseite und Sie werden den Effekt in der DEMO sehen.
Optionseinstellungen
Das Plug-in jRange bietet auch einige notwendige Optionseinstellungen, um verschiedene Anforderungen zu erfüllen.
| Optionen | Beschreibung | Standardwert |
| von | Der Mindestwert des Gleitbereichs, eine Zahl, z. B. 0 | |
| zu | Der Maximalwert des Gleitbereichs, eine Zahl, z. B. 100 | |
| Schritt | Schrittwert, Größe jeder Folie | 1 |
| Skala | Skalenbeschriftung unter dem Schieberegler, Array-Typ, z. B. [0,50,100] | [von,bis] |
| showLabels | Boolescher Typ, ob die Größenbeschriftung unter dem Schieberegler angezeigt werden soll | wahr |
| showScale | Boolescher Typ, ob die numerische Beschriftung über dem Schieberegler angezeigt werden soll | wahr |
| Formatieren | Numerisches Format | "%s" |
| largeur | Largeur de la barre de curseur | 300 |
| isRange | Que ce soit la plage de sélection. | faux |
Pour plus d'informations, veuillez vous référer au site officiel du projet jRange : https://github.com/nitinhayaran/jRange
Ce qui précède est l'intégralité du contenu de cet article. Les amis qui en ont besoin peuvent s'y référer.
