jQuery EasyUI Formular-Plugin -Slider

jQuery EasyUI 插件jQuery EasyUI Plugin

Überschreiben Sie die Standardvorgaben über $.fn.slider.defaults.

Der Slider ermöglicht es Benutzern, einen Wert aus einem begrenzten Bereich auszuwählen. Wenn das Slider-Steuerelement entlang der Spur bewegt wird, wird ein Tooltip mit dem aktuellen Wert angezeigt. Benutzer können den Slider anpassen, indem sie seine Eigenschaften festlegen.

Abhängigkeiten

  • draggable

Nutzung

Erstellen Sie einen Slider aus einem <input>-Tag, wenn er als Formularfeld verwendet wird.

<input class="easyui-slider" value="12" style="width:300px"
    data-options="showTip:true,rule:[0,'|',25,'|',50,'|',75,'|',100]">

Es ist auch zulässig, einen Slider aus einem <div> zu erstellen, aber das Attribut 'value' ist ungültig.

<div class="easyui-slider" data-options="min:10,max:90,step:10" style="width:300px"></div>

Hiermit wird ein Slider erstellt.

<div id="ss" style="height:200px"></div>

$('#ss').slider({
    mode: 'v',
    tipFormatter: function(value){
        return value + '%';
    }
});

Eigenschaften

Name Type Beschreibung Standardwert
width number Die Breite des Sliders. auto
height number Die Höhe des Sliders. auto
mode string Der Typ des Sliders. Mögliche Werte: 'h' (horizontal), 'v' (vertikal). h
reversed boolesch Wenn auf true gesetzt, werden die Positionen des Minimal- und Maximalwerts vertauscht. Diese Eigenschaft ist seit Version 1.3.2 verfügbar. false
showTip boolesch Legt fest, ob der Wert-Tooltip angezeigt wird. false
disabled boolesch Legt fest, ob der Slider deaktiviert wird. false
value number Standardwert. 0
min number Der minimal zulässige Wert. 0
max number Der maximal zulässige Wert. 100
Schrittweite number Der Wert, um den erhöht oder verringert wird. 1
rule array Beschriftungen neben dem Slider anzeigen, '|' — Wertanzeigezeile. []
tipFormatter Funktion Eine Funktion zum Formatieren des Slider-Werts. Gibt einen String-Wert zurück, der als Tooltip angezeigt wird.

Ereignisse

Name Parameters Beschreibung
onChange newValue,oldValue Wird ausgelöst, wenn sich der Wert des Felds ändert.
onSlideStart value Wird ausgelöst, wenn das Ziehen des Sliders beginnt.
onSlideEnd value Wird ausgelöst, wenn das Ziehen des Sliders endet.
onComplete value Wird ausgelöst, wenn der Wert des Sliders vom Benutzer geändert wird, egal ob durch Ziehen des Sliders oder durch Klicken auf den Slider. Dieses Ereignis ist seit Version 1.3.4 verfügbar.

Methoden

Name Parameters Beschreibung
options none Gibt die Optionen des Sliders zurück.
destroy none Zerstört das Slider-Objekt.
resize param Legt die Größe des Sliders fest. Der Parameter 'param' enthält die folgenden Eigenschaften:
width: die neue Breite des Sliders
height: die neue Höhe des Sliders
getValue none Ruft den Wert des Sliders ab.
setValue value Legt den Wert des Sliders fest.
clear none Löscht den Wert des Sliders. Diese Methode ist seit Version 1.3.5 verfügbar.
Zurücksetzen none Setzt den Wert des Sliders zurück. Diese Methode ist seit Version 1.3.5 verfügbar.
enable none Aktiviert die Slider-Komponente.
disable none Deaktiviert die Slider-Komponente.
jQuery EasyUI 插件jQuery EasyUI Plugin Weitere Erweiterungen