Показать сообщение отдельно
  #45 (permalink)  
Старый 16.10.2019, 14:06
Аспирант
Отправить личное сообщение для Aruta Посмотреть профиль Найти все сообщения от Aruta
 
Регистрация: 08.07.2019
Сообщений: 85

laimas,
.upsale__block__sub-right-wrap - родитель для всех блоков и на него вешается событие клика (show/hide блок) для .upsale__block__bot-right__sub-wrap

второстепенные input должны срабатывать при клике на .floor__item-wrap. Выше не надо подниматься для события click по этому чекбоксу

Получается логика такая:
кликаем на .floor__item-wrap и дочерний для него чекбокс получает/снимает с себя галку, а далее уже работает функция установки и проверки состояния on/off для главного чекбокса.

Чтобы не путаться, то можно сделать второстепенные чекбоксы как disabled (в html хардкодом) и, тогда нужно обработчик клика по чекбоксу перенести на .floor__item-wrap.
Вот именно этот перенос обработчика клика и нужно добавить в ваш код, чтобы всё работало не конфликтуя

Порядок (при клике на .floor__item-wrap):
click по .floor__item-wrap -> проверка состояния дочернего input для этого блока -> ставим/снимаем галку в input (if есть галка уже/нет галки) -> проверка на состояние остальных input в оставшихся .floor__item-wrap -> снятие/установка галки в inpit в .upsale__block__bot-right__title-wrap

<div class="upsale__block__sub-right-wrap">
						<div class="upsale__block__bot-right__title-wrap dflex">
							<div class="upsale__block__bot-right__title dflex">
								<input id="floor" type="checkbox" class="block__check" onclick="event.stopPropagation()"> // этот input "главный". stopPropagation() добавлен, чтобы при нажатии на input не срабатывал скрипт click для upsale__block__bot-right__title-wrap			
								<span>
									<img class="arrow arrow-up" src="" alt="arrow_down">
									Choose your floor
								</span>
							</div>
							<div class="col-title__price-wrap dflex">
								<div></div>
								<div></div>
								<div></div>
							</div>
						</div>
						<div class="upsale__block__bot-right__sub-wrap dnone" style="display: block;">
							<div class="montage__content-wrap">
								<span class="montage__text">intro text 
								<div class="montage__floor-wrap montage__comp-wrap dflex">
									<div class="montage__floor dflex">
										<div class="floor__item-wrap">   //на этот блок должен работать click и включать/выключать дочерний второстепенный input
											<div class="floor__item-inner">
												<div class="floor__item">
													<input id="first_floor" type="checkbox" name="groundfloor" value="groundfloor">  //второстепенный input
													<div class="floor__item__img">
														<img src="" alt="">
													</div>
													<span class="floor__item__text">Ground floor</span>
												</div>
											</div>
										</div>      //закрытие блока .floor__item-wrap
										<div class="floor__item-wrap">   //на этот блок должен работать click и включать/выключать дочерний второстепенный input
											<div class="floor__item-inner">
												<div class="floor__item">
													<input id="sec_floor" type="checkbox" name="middlefloor" value="middlefloor">  //второстепенный input
													<div class="floor__item__img">
														<img src="" alt="">
													</div>
													<span class="floor__item__text">Second floor</span>
												</div>
											</div>
										</div>	//закрытие блока .floor__item-wrap
										<div class="floor__item-wrap">   //на этот блок должен работать click и включать/выключать дочерний второстепенный input
											<div class="floor__item-inner">
												<div class="floor__item">
													<input id="third_floor" type="checkbox" name="topfloor" value="topfloor">  //второстепенный input
													<div class="floor__item__img">
														<img src="" alt="">
													</div>
													<span class="floor__item__text">Third floor</span>
												</div>
											</div>
										</div>  //закрытие блока .floor__item-wrap
										<div class="floor__item-wrap">  //на этот блок должен работать click и включать/выключать дочерний второстепенный input
											<div class="floor__item-inner">
												<div class="floor__item">
													<input id="all_floor" type="checkbox" name="apartment" value="apartment"> //второстепенный input
													<div class="floor__item__img">
														<img src="" alt="">
													</div>
													<span class="floor__item__text">Apartment Building</span>
												</div>
											</div>
										</div>  //закрытие блока .floor__item-wrap
									</div>
								</div>
							</div>			
						</div>			
					</div>

Последний раз редактировалось Aruta, 16.10.2019 в 14:37.
Ответить с цитированием