Показать сообщение отдельно
  #2 (permalink)  
Старый 20.06.2018, 14:17
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

Только уберите checked из строки 5 вашего html
<link rel="stylesheet" href="https://code.jquery.com/ui/1.10.3/themes/south-street/jquery-ui.css">
<style>
   ul li {
    display: inline-block; 
    margin-right: 5px; 
    padding: 3px; 
   }
</style>
<form method="post" name="calc" onsubmit="recalc(); return false;">
  <div>
    <ul>
      <li><label class="radio"><input type="radio" name="plan" value="1000" checked ><div>START</div></label>
      </li>
      <li><label class="radio"><input type="radio" name="plan" value="3000" ><div>STANDART</div></label>
      </li>
      <li><label class="radio"><input type="radio" name="plan" value="5000" ><div>PREMIUM</div></label>
      </li>
  </ul>
</div>
            
<div>
  <input name="sum" id="calc_sum" type="text" class="minCost" value=""/>
  <div class="slider"></div>
</div>
<div>
  <input name="calc_btn" value="Рассчитать" type="submit">
</div>

</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
jQuery(document).ready(function($) {
  var plan = $('input[name=plan');
  var input = $('input.minCost');
  var slider = $('.slider').slider({
    range: 'max',
    min: 100,
    max: 5000,
    value: 100,
    step: 10,
    animate: 300,
    slide: function(event, ui) {
      input.val(ui.value);
      checkPlan();
    }
  });

  input.val(slider.slider('value'));
  checkPlan();

//  input.on('change', function() {
//    slider.slider('value', $(this).val());
//  });
  plan.on('change', function() {
        slider.slider('value', $(this).val());
        input.val($(this).val());
  });
  
  input.on('change', function() {

	var value1=input.val();
    if (value1 > 5000) { value1 = 5000; input.val(5000)}
    if (value1 < 100) { value1 = 100; input.val(100)}

	slider.slider('value',value1);
        checkPlan();	
});
// фильтрация ввода в поля
	jQuery('input').keypress(function(event){
		var key, keyChar;
		if(!event) var event = window.event;
		
		if (event.keyCode) key = event.keyCode;
		else if(event.which) key = event.which;
	
		if(key==null || key==0 || key==8 || key==13 || key==9 || key==46 || key==37 || key==39 ) return true;
		keyChar=String.fromCharCode(key);
		
		if(!/\d/.test(keyChar))	return false;	
	});

   function checkPlan() {
     plan.each(function(i, elem) {
          if(+input.val() <= +elem.value) {
             $(elem).prop('checked', true);
             return false;  
          }
     });
   }
});
</script>

Последний раз редактировалось Dilettante_Pro, 20.06.2018 в 14:35.
Ответить с цитированием