Jquery плагин Powerange вешает браузер?

Работаю над онлайн-калькулятором, использую js плагин Powerange, вчера еще все хорошо работало, пока не появилась необходимость в нескольких slider цен, и реализовал так:

calc = {
        active : '',
        run: function () {
            var tab = $('.calculator-type-el .active');

            this.active = tab.data('tab');

            $('.animate-block .calculator-type').removeClass('active-tab');

            this.js();

            $('.animate-block .calculator [data-type="'+this.active+'"]').each(function (indx,element) {
                $(element).addClass('active-tab');
            });


        },
        swither: function () {
            $('.cal-tab').click(function () {
                var is = $(this);

                $('.cal-tab.active').removeClass('active');

                is.addClass('active');

                calc.run();

            })
        },
        router: function () {
            this.run();
            this.swither();
        },
        js: function () {

             switch (this.active){
                case 'site' :
                    this.price({
                        name : this.active,
                        step : 5000,
                        min  : 30000,
                        max  : 300000,
                        start: 100000
                    });
                break;

                case 'design' :
                    this.price({
                        name : this.active,
                        step : 5000,
                        min  : 15000,
                        max  : 50000,
                        start: 15000
                    });
                break;

                case 'seo' :
                    this.price({
                        name : this.active,
                        step : 5000,
                        min  : 15000,
                        max  : 50000,
                        start: 15000
                    });
                break;

                default :

                break;
            }
        },
        price: function (arr){

            if($('#range-' + arr.name).next().attr('class') === 'range-bar'){
                return false;
            }

            var elem = document.querySelector('#range-' + arr.name);
             var init = new Powerange(elem, {
                min      : 30000,
                max      : 300000
            //    start    : 150000,
            //    step     : 5000
            });

            elem.onchange = function() {
                var price = elem.value;

                if(price.length === 5){
                    price = price.substring(0,2) + ' ' + price.substring(2,5);
                }else {
                    price = price.substring(0,3) + ' ' + price.substring(3,6);
                }

                document.getElementById('site-price-' + arr.name).value = price + ' р.';
            };
        }
    };

    calc.router();


Вроде бы все просто, автоматически выводятся ползунки от текущий вкладки ( активному элементу с классом active) например:

c8fa9ae3f8af4372a7b12bc8fb968fbf.png

По умолчанию при запуске .active стоит у таба "сайт", соответственно все выводится и работает, но как только я захочу установить параметры для powerange, вернее раскомментировать те строчки:
var init = new Powerange(elem, {
                min      : 30000,
                max      : 300000,
                start    : 150000,
                step     : 5000
            });


Start это начальный параметр ползунка,
step это изменение + 5000 к сумме

Так вот после раскомментирования этих строчек, пейзаж:

download?id=nbTuJkFhAfMqvzO47JXe1VGZzRJLRo

Замечу, что отдельно т.е без объекта calc все работает, (только на одном табе)

Помогите решить проблему, почему браузеры все включая Chrome, safari, ie, opera и firefox вешаются?

UPD:

Он действительно не работает внутри объекта, кто может объяснить в чем дело?

следующий код работает на ура вне объекта calc:

var elem = document.querySelector('#range-site');
        var init = new Powerange(elem, { min: 16, max: 256, start: 128 });
  • Вопрос задан
  • 2929 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы