javascript - html range slider, click change only one value -
i have range slider this:
<input id="wykup-koncowy" class="range-slider" type="range" max="2" min="0" value="0" real-value="1"> and in js/jq control values on input. when grab slider , move every works perfect, need when click value +1 or -1, example:
input have value = 0, click value = 2, input have value = 1
ex2: input have value = 2, click value = 1, input have value = 1
ex3: input have value = 2, click value = 0, input have value = 1
i try add wykup_point , wykup_point_val variable cache values not works. js view this:
var kwota = $('#wartosc-przedmiotu'), wykup_koncowy_kwota = 0, wplata_wlasna_kwota = 0, wykup_point = 0, wykup_point_val = 0 ; jquery(function($){ wykup_point_val = $('#wykup-koncowy').val(); }) const available_values = [1, 5, 10]; const max = available_values.length - 1, min = 0; wykup_koncowy_kwota = r1(kwota.val() - kwota.val()*((100-available_values[min])/100)); var output = $('.wykup-koncowy-text').text(available_values[min]+'% ('+wykup_koncowy_kwota+' pln)'); $(function() { $('#wykup-koncowy').click(function(e){ // e.preventdefault(); if($(this).val() > wykup_point_val){ wykup_point_val++; wykup_point = $(this).val(wykup_point_val); var hodnota = parseint(wykup_point_val, 10); $(this).attr('real-value', available_values[hodnota]); }else{ wykup_point_val--; wykup_point = $(this).val(wykup_point_val); var hodnota = parseint(wykup_point_val, 10); $(this).attr('real-value', available_values[hodnota]); } wykup_koncowy_kwota = r1(kwota.val() - kwota.val()*((100-$(this).attr('real-value'))/100)); output.text($(this).attr('real-value')+'% ('+wykup_koncowy_kwota+' pln)'); }) $('#wykup-koncowy').on('input', function(event) { var hodnota = parseint($(this).val(), 10); $(this).attr('real-value', available_values[hodnota]); wykup_koncowy_kwota = r1(kwota.val() - kwota.val()*((100-$(this).attr('real-value'))/100)); output.text($(this).attr('real-value')+'% ('+wykup_koncowy_kwota+' pln)'); }); }); $(".range-slider") .attr({ 'max': max, 'min': min, 'value': string(min), 'real-value': available_values[0] });
Comments
Post a Comment