Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.05.2021, 15:22
Новичок на форуме
Отправить личное сообщение для nikofedorov Посмотреть профиль Найти все сообщения от nikofedorov
 
Регистрация: 09.02.2020
Сообщений: 8

Не работает ползунок цен в интернет-магазине
Добрый день!

Помоги разобраться, вроде все настроил, но все равно не работает ползунок цен в интернет-магазине. В чем может быть проблема?

Сайт: https://fifaday.ru/shop/all

Код:
<div class="fg">
 <div class="nav-cat">
 <style>@import url(https://fifaday.ru/css/filter-sale.css);</style>
 <script src="https://fifaday.ru/js/jquery-ui.min.js"></script>
 <div class="flist-item" id="flist-item-price"><span class="flist-label" id="flist-label-price">Цена:</span> <input type="text" id="price_min" class="price_filter" value="">
 <input type="text" id="price_max" class="price_filter" value="">
 <button onclick="setPriceFilter();">Фильтровать</button>
 <button onclick="cancelPriceFilter();">Сбросить</button>

 <script type="text/javascript">
 var shopFilterMinPrice = 0;
 var shopFilterMaxPrice = 300000;

 $('#price_min').on('change', function(){
 var minEl = $(this);
 var maxEl = $('#price_max');

 var minElVal = correctPriceFilterMinValue(minEl.val());
 var maxElVal = correctPriceFilterMaxValue(maxEl.val());

 if(minElVal > maxElVal){
 minElVal = maxElVal;
 }

 minEl.val(minElVal);
 maxEl.val(maxElVal);
 });

 $('#price_max').on('change', function(){
 var minEl = $('#price_min');
 var maxEl = $(this);

 var minElVal = correctPriceFilterMinValue(minEl.val());
 var maxElVal = correctPriceFilterMaxValue(maxEl.val());

 if(minEl.val()){
 if(maxElVal < minElVal){
 maxElVal = minElVal;
 }
 }else{
 if(maxElVal < shopFilterMinPrice){
 maxElVal = shopFilterMinPrice;
 }
 }

 minEl.val(minElVal);
 maxEl.val(maxElVal);
 });

 function correctPriceFilterMinValue(val){
 var inpMinVal = val;

 if(inpMinVal && /[^0-9]/.test(inpMinVal) == false){
 inpMinVal = parseInt(inpMinVal);
 if(inpMinVal < shopFilterMinPrice){
 inpMinVal = shopFilterMinPrice;
 }
 }else{
 inpMinVal = shopFilterMinPrice;
 }

 return inpMinVal;
 }

 function correctPriceFilterMaxValue(val){
 var inpMaxVal = val;

 if(inpMaxVal && /[^0-9]/.test(inpMaxVal) == false){
 inpMaxVal = parseInt(inpMaxVal);
 if(inpMaxVal > shopFilterMaxPrice){
 inpMaxVal = shopFilterMaxPrice;
 }
 }else{
 inpMaxVal = shopFilterMaxPrice;
 }

 return inpMaxVal;
 }

 function setPriceFilter(){
 var error = '',
 inpMinVal = $("#price_min").val(),
 inpMaxVal = $("#price_max").val();

 if(inpMinVal == undefined || price_min == ''){
 inpMinVal = 0;
 error += '<li>Не указано минимальное значение</li>';
 }else{
 if(inpMinVal < 0 || /[^0-9]/.test(inpMinVal) !== false){
 inpMinVal = 0;
 error += '<li>Недопустимое минимальное значение. Допустимо только целочисленные положительные значения.</li>';
 }else{
 inpMinVal = parseInt(inpMinVal);
 if(inpMinVal > 100000000000000000){
 error += '<li>Недопустимое минимальное значение. Слишком большое значение</li>';
 }
 }
 }

 if(inpMaxVal == undefined || inpMaxVal == ''){
 inpMaxVal = 0;
 error += '<li>Не указано максимальное значение</li>';
 }else{
 if(inpMaxVal < 0 || /[^0-9]/.test(inpMaxVal) !== false){
 inpMaxVal = 0;
 error += '<li>Недопустимое максимальное значение. Допустимо только целочисленные положительные значения.</li>';
 }else{
 inpMaxVal = parseInt(inpMaxVal);
 if(inpMaxVal > 100000000000000000){
 error += '<li>Недопустимое максимальное значение. Слишком большое значение</li>';
 }
 }
 }

 if(inpMaxVal < inpMinVal){
 error += '<li>Минимальное значение должно быть меньше максимального.</li>';
 }

 if(!error){
 return priceFilter('price', inpMinVal+'|'+inpMaxVal);
 }else{
 shop_alert(
 '<ul>'+error+'</ul>',
 window.uCoz.shopSigns[210178],
 'warning',
 350,
 120,
 {tm:8000, align:'left', icon:'img/warning.png'}
 );
 }

 return false;
 }

 function cancelPriceFilter(){
 priceFilter('price', '');
 $("#price_min").val('');
 $("#price_max").val('');

 return false;
 }
 </script></div>
 <div id="price-range-zone">
 <div id="price-range-2"></div>
 <div id="price-range-grid"></div>
 </div>
 <script>
 if($("#price_min").val()!='') {
 cancelPriceFilter();
 }
 $("#price_min").val(shopFilterMinPrice);
 $("#price_max").val(shopFilterMaxPrice);
 $("#price-range-2").slider({
 range: true,
 min: shopFilterMinPrice,
 max: shopFilterMaxPrice,
 values: [shopFilterMinPrice, shopFilterMaxPrice],
 step: 1,
 slide: function(event, ui){
 $("#price_min").val(ui.values[0]);
 $("#price_max").val(ui.values[1]);
 },
 change: function( event, ui ){
 FiltGroup.fromHint = $('#price-range-zone');
 return priceFilter('price', ui.values.join('|')), setTimeout(FiltGroup.postFilter, 1000);
 }
 });
 $("#price-range-2").append('<span class="irs-min" style="visibility: hidden;"></span><span class="irs-max" style="visibility: hidden;"></span><span class="irs-from" style="visibility: visible; left: -3.125%;"></span><span class="irs-to" style="visibility: visible; left: 85.208333333%;"></span><span class="irs-single" style="visibility: hidden; left: 32.083333333%;"></span>');
 $('.irs-min').html(shopFilterMinPrice).css({
 'left': '0%',
 'margin-left': $('.irs-min').outerWidth() / -2
 });
 $('.irs-max').html(shopFilterMaxPrice).css({
 'left': '100%',
 'margin-left': $('.irs-max').outerWidth() / -2
 });
 $('.irs-from').html(shopFilterMinPrice).css({
 'left': '0%',
 'margin-left': $('.irs-from').outerWidth() / -2
 });
 $('.irs-to').html(shopFilterMaxPrice).css({
 'left': '100%',
 'margin-left': $('.irs-to').outerWidth() / -2
 });
 $('.irs-single').html(shopFilterMinPrice + ' — ' + shopFilterMaxPrice);
 $("#price-range-grid").append('<span class="irs-grid" style="width: 97.8%; left: 1%;"><span class="irs-grid-pol" style="left: 0%"></span><span class="irs-grid-text js-grid-text-0" style="left: 0%;"></span><span class="irs-grid-pol small" style="left: 20%"></span><span class="irs-grid-pol small" style="left: 15%"></span><span class="irs-grid-pol small" style="left: 10%"></span><span class="irs-grid-pol small" style="left: 5%"></span><span class="irs-grid-pol" style="left: 25%"></span><span class="irs-grid-text js-grid-text-1" style="left: 25%; visibility: visible;"></span><span class="irs-grid-pol small" style="left: 45%"></span><span class="irs-grid-pol small" style="left: 40%"></span><span class="irs-grid-pol small" style="left: 35%"></span><span class="irs-grid-pol small" style="left: 30%"></span><span class="irs-grid-pol" style="left: 50%"></span><span class="irs-grid-text js-grid-text-2" style="left: 50%; visibility: visible;"></span><span class="irs-grid-pol small" style="left: 70%"></span><span class="irs-grid-pol small" style="left: 65%"></span><span class="irs-grid-pol small" style="left: 60%"></span><span class="irs-grid-pol small" style="left: 55%"></span><span class="irs-grid-pol" style="left: 75%"></span><span class="irs-grid-text js-grid-text-3" style="left: 75%; visibility: visible;"></span><span class="irs-grid-pol small" style="left: 95%"></span><span class="irs-grid-pol small" style="left: 90%"></span><span class="irs-grid-pol small" style="left: 85%"></span><span class="irs-grid-pol small" style="left: 80%"></span><span class="irs-grid-pol" style="left: 100%"></span><span class="irs-grid-text js-grid-text-4" style="left: 100%;"></span></span>');
 for (var i = 0; i <= 4; i++) {
 $('.js-grid-text-' + i).html( Math.round(shopFilterMaxPrice / 4 * i) ).css({
 'margin-left': $('.js-grid-text-' + i).outerWidth() / -2
 });
 }
 function normaliseHint () {
 $('.irs-from').html( $("#price_min").val() ).css({
 'left': $('.ui-slider-handle').eq(0).position().left,
 'margin-left': $('.irs-from').outerWidth() / -2
 });
 $('.irs-to').html( $("#price_max").val() ).css({
 'left': $('.ui-slider-handle').eq(1).position().left,
 'margin-left': $('.irs-to').outerWidth() / -2
 });
 var s = $('.ui-slider-handle').eq(1).position().left - $('.ui-slider-handle').eq(0).position().left;
 $('.irs-single').html($("#price_min").val() + ' — ' + $("#price_max").val()).css({
 'left': $('.ui-slider-handle').eq(0).position().left + (s / 2),
 'margin-left': $('.irs-single').outerWidth() / -2
 });
 var w = $('.irs-single').outerWidth();
 if (w > s) {
 $('.irs-from, .irs-to').css({visibility: 'hidden', opacity: 0});
 $('.irs-single').css({visibility: 'visible', opacity: 1});
 } else {
 $('.irs-from, .irs-to').css({visibility: 'visible', opacity: 1});
 $('.irs-single').css({visibility: 'hidden', opacity: 0});
 }
 var w_min = $('.irs-min').outerWidth();
 if ($('.irs-from').position().left > w_min) {
 $('.irs-min').css({visibility: 'visible', opacity: 1});
 } else {
 $('.irs-min').css({visibility: 'hidden', opacity: 0});
 }
 var w_max = $('.irs-min').outerWidth();
 if ( $('#price-range-2').width() - $('.irs-to').position().left > w_max) {
 $('.irs-max').css({visibility: 'visible', opacity: 1});
 } else {
 $('.irs-max').css({visibility: 'hidden', opacity: 0});
 }
 }
 $(document).mousemove(function () {
 normaliseHint();
 setTimeout(normaliseHint, 160);
 });
 </script>
 </ul>
 </div>

Спасибо!

Последний раз редактировалось nikofedorov, 03.05.2021 в 15:36.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
jQyery функция странно работает! Midel Общие вопросы Javascript 4 08.04.2012 13:40
Не работает код внутри циклов DZHETIGAPA Events/DOM/Window 1 21.06.2011 01:03
не работает в Интернет Експлорер jei Javascript под браузер 1 12.06.2010 14:28
Интернет магазин работает только в IE Advokatura Internet Explorer 1 02.04.2010 12:45
Динамическая HTML форма (FireFox - работает, IE - не работает) dm1tr1y Общие вопросы Javascript 10 11.12.2009 15:59