ЧИМ пишет:Добрый день формучане!
Чёт не лезет в голову как обойти проблему не нагромождая её ненужными элементами.
Пытаюсь сделать что то вроде карточки, в которой по селекту выбирается пункт меню и исходя из него скрываются определённые строки из таблицы и показываются только нужные.
Получается что для того что бы расширить список например до 10-20 наименований, мне нужно будет в каждом кейсе скрывать все строки таблицы которые не соответствуют выбору, т.е. делать по циклу для каждого класса чтоб изменить атрибут hidden.
Существует ли более элегантное исполнение таких примеров?
Добрый день!
Можно сделать так:
1. Вмето классов "print","sist" и.т.д. до 20 и более пишем классы "table_row_group1","table_row_group2", "table_row_group3" и.т.д.
2. Свойства определяем так:
3. определяем два класса:
4. Сам принцип развёртывания и свёртывания - ипользование мультиклассов в js.
Например, "table_row_group1 on" или "table_row_group1 off"
5. Для этого Вам нужно определить какой класс и как нужно модифицировать
и для него определить мультикласс "table_row_group1 on", а для остальных "table_row_group1 off"
6.Для реализации этой затеи Вам пригодятся несколько js-функцийСпойлер (Отобразить)CODE ( javascript):
скопировать код в буфер обмена
/* For functions getElementsByClassName, addClassName, and removeClassName Copyright Robert Nyman, http://www.robertnyman.com Free to use if this text is included */ function getElementsByClassName(className, tag, elm){ var testClass = new RegExp("(^|\\s)" + className + "(\\s|$)"); var tag = tag || "*"; var elm = elm || document; var elements = (tag == "*" && elm.all)? elm.all : elm.getElementsByTagName(tag); var returnElements = []; var current; var length = elements.length; for(var i=0; i<length; i++){ current = elements[i]; if(testClass.test(current.className)){ returnElements.push(current); } } return returnElements; } function addClassName(elm, className){ var currentClass = elm.className; if(!new RegExp(("(^|\\s)" + className + "(\\s|$)"), "i").test(currentClass)){ elm.className = currentClass + ((currentClass.length > 0)? " " : "") + className; } return elm.className; } function removeClassName(elm, className){ var classToRemove = new RegExp(("(^|\\s)" + className + "(\\s|$)"), "i"); elm.className = elm.className.replace(classToRemove, "").replace(/^\s+|\s+$/g, ""); return elm.className; }
Удачи!(Отредактировано автором: 04 Марта, 2019 - 18:44:04)
|