Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Ламерские вопросы » Как сократить или оптимизировать скрипт?

Как сократить или оптимизировать скрипт?


     14.09.2015    Все вопросы » Ламерские вопросы    2387

вопрос
Есть скрипт который скрывает или показывает блоки в зависимости от выбранного селекта. При большом количестве селектов в списке скрипт получается огромным, возможно ли его как то оптимизировать?
function Selected(a) {
        var label = a.value;
        if (label==1) {
            document.getElementById("xfield_holder_model").style.display='block';
            document.getElementById("xfield_holder_model1").style.display='none';            
        } else if (label==2) {
            document.getElementById("xfield_holder_model").style.display='none';
            document.getElementById("xfield_holder_model1").style.display='block';  
        } else if (label==3) {
            document.getElementById("xfield_holder_model").style.display='none';
            document.getElementById("xfield_holder_model1").style.display='none';
            document.getElementById("xfield_holder_model3").style.display='block';
        } else if (label==4) {
            document.getElementById("xfield_holder_model").style.display='none';
            document.getElementById("xfield_holder_model1").style.display='none';
            document.getElementById("xfield_holder_model3").style.display='none';
            document.getElementById("xfield_holder_model4").style.display='none';
            document.getElementById("xfield_holder_model5").style.display='block';
        } else {
            document.getElementById("xfield_holder_model").style.display='none';
            document.getElementById("xfield_holder_model1").style.display='none';
            document.getElementById("xfield_holder_model3").style.display='none';
            document.getElementById("xfield_holder_model4").style.display='none';
            document.getElementById("xfield_holder_model5").style.display='none';
        }  
        
}

Ответил: werty1001


function selected(v) {

    var list = document.getElementById('list').children,
        value = parseInt(v);

    for (var i=list.length; i--;) { list[i].style.display='none'; }

    if (value === 1) show(['xfield_holder_model']);
    else if (value === 2) show(['xfield_holder_model1']);
    else if (value === 3) show(['xfield_holder_model3']);
    else if (value === 4) show(['xfield_holder_model5']);

}

function show(el) {
    el.forEach(function(id) {
        document.getElementById(id).style.display='block';
    });
}
Живой пример тык

13 комментариев

werty1001
Юзер

werty1001 - 14 сентября 2015 21:56 -

Можете еще
else if
заменить на
if
и сократить идентификаторы, например просто
model_1
и.т.д.

follor
Юзер

follor - 14 сентября 2015 22:34 -

werty1001, спасибо)

follor
Юзер

follor - 14 сентября 2015 23:51 -

Попытался его использовать, никак не хочет работать, в jsfiddle работает а на сайте не хочет, перепробовал всё а причины конфликта так и не нашёл(

werty1001
Юзер

werty1001 - 15 сентября 2015 15:19 -

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

follor
Юзер

follor - 15 сентября 2015 20:01 -

Смена имени так же не помогла, причину так и не нашел. Нашёл другой скрипт вроде как работающий, но так же требующий корректировок.

dj-avtosh
PHP-developer

dj-avtosh - 15 сентября 2015 07:54 -

Как вариант:



document.getElementById('selected').addEventListener('change', function() { selected(this.value); }, false);

function selected(v) {

    var list = document.getElementById('list').children, value = parseInt(v);
    
    for (var i=list.length; i--;) { list[i].style.display='none'; }

    obj = {1:'', 2:1, 3:3, 4:5}

    show(['xfield_holder_model' + obj[value]]);

}

function show(el) {
    el.forEach(function(id) {
        document.getElementById(id).style.display='block';
    });
}


По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

dj-avtosh
PHP-developer

dj-avtosh - 15 сентября 2015 08:09 -

Чуть короче
document.getElementById('selected').addEventListener('change', function() { selected(this.value); }, false);

function selected(v) {
    Array.prototype.forEach.call(document.getElementById('list').children, function(element){element.style.display='none';});
    
    obj = {1:'', 2:1, 3:3, 4:5}
    
    show(['xfield_holder_model' + obj[parseInt(v)]]);

}

function show(el) {
    el.forEach(function(id) {
        document.getElementById(id).style.display='block';
    });
}

По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

follor
Юзер

follor - 15 сентября 2015 09:50 -

Опять же, в jsfiddle работает а на сайте не хочет, не пойму в чем проблема, буду искать конфликтующий сркипт, отключая их поочерёдно

dj-avtosh
PHP-developer

dj-avtosh - 15 сентября 2015 09:56 -

напиши в скайп, гляну.

По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

follor
Юзер

follor - 15 сентября 2015 19:53 -

Нашёл скрипт который вроде как работает на моем сайте, но не получается его оптимизировать под свои нужды
вот то что нашёл

А вот то что у меня

dj-avtosh
PHP-developer

dj-avtosh - 16 сентября 2015 02:51 -

Опишите логику, что хотите что бы делал скрипт с Вашими выпадающими списками.

По заказам пишем сюда: @Rud00y

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.):
В телегу писать сразу задачу и бюджет.

follor
Юзер

follor - 16 сентября 2015 10:02 -

По данным из этой ссылки, селект с именем Марка автомобиля - основной, при выборе в нём пункта 1 должен появиться второй селект который ниже модель, при выборе пункта 2 другой селект и т. д.

follor
Юзер

follor - 27 декабря 2015 21:38 -

Как к этому скрипту прикрутить второй набор селектов? С другим id

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх