Jquery UI-Slider verändern Sie den Wert des Schiebereglers geändert, wenn im input-Feld

JS:

$("#storlekslider").slider({
  range: "max",
  min: 0,
  max: 1500,
  value: 0,
  slide: function(event, ui) {
    $("#storlek_testet").val(ui.value);
    $(ui.value).val($('#storlek_testet').val());
  }
});
//$( "#storlek_testet" ).val( $( "#storlekslider" ).slider( "value" ) );

$("#storlek_testet").change(function() {
  $("#storlekslider").slider("value", $(this).val());
});

HTML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css">
<div id="storlekslider"></div>
<input type="text" name="storlek" id="storlek_testet" value="500" />

Heres eine js fiddle

im Versuch, Holen Sie den Schieberegler, um zu springen, um die richtige position wenn ich ändern Sie den Wert in das Eingabefeld ein.
Iam mit der Jquery UI slider.

InformationsquelleAutor oBo | 2012-10-09

19

Befestigen Sie die change Falle Ihre Eingabe etwa so:
```
$("#storlek_testet").change(function() {
    $("#storlekslider").slider("value", $(this).val());
});
```
- $(this).val() kann verwendet werden, anstelle der Selektor $("storlek_testet").val()
- es ist auch # und ); fehlt 😉
- Danke, ich habe aktualisiert es...
InformationsquelleAutor Constantinius
5
```
$("#storlek_testet").keyup(function() {
    $("#storlekslider").slider("value" , $(this).val())
});
```
http://jsfiddle.net/C8X4D/
- wie es zu implementieren, für die wordpress-plugin-option-panel
- change() vorzuziehen ist keyup() wenn input ist der Typ number, weil keyup() nicht die änderungen anzuwenden, wenn das Feld nach oben/nach unten-Tasten werden verwendet, um den Eingangswert zu ändern.
InformationsquelleAutor Ch4rAss

Ändern Sie Werte aus mehreren Eingänge:

$("#input-1").change(function() {
    $("#slider").slider('values',0,$(this).val());
});
$("#input-2").change(function() {
    $("#slider").slider('values',1,$(this).val());
});