Показать сообщение отдельно
  #4 (permalink)  
Старый 09.12.2018, 15:16
Профессор
Отправить личное сообщение для the_little Посмотреть профиль Найти все сообщения от the_little
 
Регистрация: 25.09.2017
Сообщений: 186

Огромное спасибо!

Работает как надо, за исключением некоторых моментов, которые я частично смог доработать, какие-то нет.

Поскольку у меня при работе с разными списками должны отрабатывать разные функции, то я добавил внутри функции if.
Работает.

И еще пара момент.

При нажатии на a.slct - этой ссылке должен присваиваться .active
Я вроде смог это прописать.

А вот убрать его получилось не во всех случаях.
1) Если клик по странице вне списка - сделал, убирается, хорошо.
2) Если нажать на элемент списка (выбрать новый пункт) - тоже убирается, хорошо.
3) Если открыть список и нажать на a.slct, т.е. не менять выбранный, то класс active у .slct остается.

и еще момент, не знаю на сколько это можно реализовать...
Когда список закрывается - то снимается класс active у .slct.
Поскольку при стилизации меняется border-radius, то при сворачивании списка - получается не красиво.
МОжно ли как-то удаление класса active у .slct отложить на время сворачивания. Можно было бы задержку какую-то выставить вручную, но проблема в том что длина списков разная. Где-то 1 пункт, где-то 10-50. Соответсвенно время сворачивания разное.

Вот что у меня сейчас получилось.

$(function() {
    $(".select").on("click", ".slct, li", function(event) {
        event.preventDefault();
        $(this).parent().find(".slct").addClass("active");
        var parent = event.delegateTarget;
        $(".drop", parent).slideToggle();
        if ($(this).is("li")) {
            event.stopPropagation();
            $(this).addClass("active").siblings().removeClass("active");
            var title = this.textContent.trim();
            $(".slct", parent).text(title);
            $("input", parent).val(title);
            calculate();
            if ($(this).parent().hasClass("drop_model")) {
                selectLiImageNumber(title)
                checkSizeRadio();
            } else if ($(this).parent().hasClass("drop_stella")) {
                showModelUl();
                checkSizeRadio();
            }
            $(".slct").removeClass("active");
        }
    }).find("li:first").addClass("active");
    $(document).click(function(event) {
        $(event.target).closest(".select").length || $(".select .drop").slideUp() && $(".slct").removeClass("active");
    });
});
Ответить с цитированием