Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Как выцепить значение ползунка UI? (https://javascript.ru/forum/jquery/44528-kak-vycepit-znachenie-polzunka-ui.html)

xmax 23.01.2014 12:45

Как выцепить значение ползунка UI?
 
В общем имеется например такой код
$("#slider-first").slider({
	min: minds,
	max: maxds,
	value: minds,
	animate: true,
	slide: function( event, ui ) {
		$( "#amount-first" ).val( ui.value );
		$( "#amount-firstball" ).val( ui.value*1.5 );
	}
});

Можно ли при изменении значения ползунка, получать это значение для дальнейшего использования в JS?

рони 23.01.2014 12:51

Цитата:

Сообщение от xmax
Можно ли при изменении значения ползунка, получать это значение для дальнейшего использования в JS?

а что мешает получить значение ползунка?

xmax 23.01.2014 13:43

$("#slider-first").slider({
	min: mindsil,
	max: maxdsil,
	value: [mindsil],
	animate: true,
	slide: function( event, ui ) {
		$( "#amount-first" ).val( ui.value );
		var chkbdfirst = ui.value;
		$( "#amount-ballfirst" ).val( chkbdfirst );
		}
	});
var balldf = chkbdfirst*1.5;

То, что подсчитает внутри - выведет. Если написать var balldf = chkbdfirst*1.5;, то вообще ползунок пропадает

рони 23.01.2014 14:16

xmax,
я вас непонимаю ... есть нормальные способы получить значения
<!DOCTYPE HTML>
<html>

<head>

  <meta charset="utf-8">
  <title>slider demo</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/south-street/jquery-ui.css">
  <style>
  #slider-first { margin: 10px; }
  #amount-first, #amount-ballfirst{
       position: relative;
       width: 30px;
       top: 5px;

    }
  	</style>

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

</head>

<body>
<input id="amount-first">
<input id="amount-ballfirst">
<div id="slider-first"></div>
<input id="test" type="button" value="получить значение ползунка">
<script>
var mindsil = 10, maxdsil = 517;
$("#slider-first").slider({
	min: mindsil,
	max: maxdsil,
	value: mindsil,
	animate: true,
	slide: function( event, ui ) {
	   $( "#amount-first" ).val( ui.value );
		$( "#amount-ballfirst" ).val( ui.value*1.5 );
		},
    change: function( event, ui ) {
	   $( "#amount-first" ).val( ui.value );
		$( "#amount-ballfirst" ).val( ui.value*1.5 );
		}

	});
var value = $("#slider-first").slider("option", "value");
   $( "#amount-first" ).val( value );
   $( "#amount-ballfirst" ).val( value*1.5 );

$('#test').click(
function ()
{  var val = $( "#amount-first" ).val(),  // получить значение ползунка 1 спосооб
       val2 = $("#slider-first").slider("option", "value");  // получить значение ползунка стандартный спосооб
   alert([val,val2])
}
)


</script>
</body>
</html>

xmax 23.01.2014 15:52

Чуть-чуть ближе уже, но все же есть такая задача:
2, 3 и тд ползунка выдают какие-либо числа. Есть число N, данное вначале. И после этого двигая ползунки надо, чтобы изменялось итоговое число, без нажатий кнопок, выдавалось в текстовом поле.

$("#slider-1").slider({
	min: mind1,
	max: 33300,
	value: [mind1],
	animate: true,
	slide: function( event, ui ) {
		$( "#amount-1" ).val( ui.value );
		$( "#amount-ball1" ).val( ui.value*0.25 );
		var	valDMS = $("#slider-1").slider("value");
		valDMS = valDMS*0.25;
	},
	change: function( event, ui ) {
		$( "#amount-1" ).val( ui.value );
		$( "#amount-ball1" ).val( ui.value*0.25 );
		var	valDMS = $("#slider-1").slider("value");
		valDMS = valDMS*0.25;
	}
});
				
var valDMS = $("#slider-1").slider("option", "value");
$( "#amount-1" ).val( valDMS );
$( "#amount-ball1" ).val( valDMS*0.25 );

var	valDMS = $("#slider-1").slider("value");
valDMS = valDMS*0.25;
				
$("#slider-2").slider({
	min: mind2,
	max: maxd2,
	value: [mind2],
	animate: true,
	slide: function( event, ui ) {
		$( "#amount-2" ).val( ui.value );
		$( "#amount-ball2" ).val( ui.value*1 );
		var	valDMT = $("#slider-2").slider("value");
		valDMT = valDMT*1;
	},
	change: function( event, ui ) {
		$( "#amount-2" ).val( ui.value );
		$( "#amount-ball2" ).val( ui.value*1 );
		var	valDMT = $("#slider-2").slider("value");
		valDMT = valDMT*1;
	}
});

var valDMT = $("#slider-2").slider("option", "value");
$( "#amount-2" ).val( valDMT );
$( "#amount-ball2" ).val( valDMT*1 );

var	valDMT = $("#slider-2").slider("value");
valDMT = valDMT*1;
				
var summball =  valDMS + valDMT;
var ostball = itogodball - summball;
$( "#amount-ballost" ).val( ostball );

Он считает в данном случае только те значения, что при загрузке стоят не дефолте. При изменении позунка не пересчитывает данные. Нужно просчитывать все значения внутри каждого слайдера, но если в каждый встроить, то он в 1 случае считает от начального, далее тоже от начального.

рони 23.01.2014 16:09

xmax,
заносите изменение значение каждого ползунка в массив -- нулевого в нулевую ячейку и т.д.а сумму всех ячеек куда вам нужно


Часовой пояс GMT +3, время: 15:35.