0

Доброго времени суток!

Можно ли без скрипта сделать, чтобы при нажатии на зелёный элемент не срабатывал input checkbox'а? В примере наглядно вопрос изложен. В интернетах ничего по этому вопросу не нашёл, выручите пожалуйста.

li {
  border: 1px solid black;
  }
  li ul li {
    background: green;
  }
    <div class="btn_menu">
    	<input type="checkbox" id="spinner-form4" />
    	<label for="spinner-form4" class="btn_menu_img_on">
    		<ul class="box_menu">
    			<li>Текст 
    				<ul><li>При нажатии сюда - не должен срабатывать input в checkbox</li></ul>
    			</li>
    			<li>Текст</li>
    		</ul>
    	</label>
    </div>
    		
    	

2 ответа 2

2

Вообщем - то не сложно:

document.querySelector('.disabled').addEventListener('click',(event)=> {
  event.preventDefault();
})
.box_menu {
  user-select: none;
}
li {
  border: 1px solid black;
}
li ul li {
  background: green;
}
    <div class="btn_menu">
    	<input type="checkbox" id="spinner-form4" />
    	<label for="spinner-form4" class="btn_menu_img_on">
    		<ul class="box_menu">
    			<li>Текст 
    				<ul>
              <li class='disabled'>При нажатии сюда - не должен срабатывать input в                       checkbox</li>
            </ul>
    			</li>
    			<li>Текст</li>
    		</ul>
    	</label>
    </div>

2
  • 1
    Как понимаю, только с помощью CSS эту задачу не победить. Спасибо! 30 ноя 2018 в 12:07
  • 1
    К сожалению нет, по причине всплытия события. Я пробовал user select: none, но в этой ситуации он не помогает. Предлагаю все же ознакомиться с этим свойством.
    – Zicrael
    30 ноя 2018 в 12:15
0

Я суть вопроса не понял это подойдет

<input type="checkbox" id="spinner-form4" disabled/>
1
  • Нет, это полностью отключает input. Я подредактировал вопрос. Там зелёным обозначена область, при нажатии на которую не должна появляться / убираться галочка в checkbox. 30 ноя 2018 в 11:08

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.