Javascript-форум - Снятие чекбокса при клике на пункт меню

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Снятие чекбокса при клике на пункт меню (https://javascript.ru/forum/dom-window/72937-snyatie-chekboksa-pri-klike-na-punkt-menyu.html)

Снятие чекбокса при клике на пункт меню

Всем добрый вечер! Прошу помочь, есть сайт с ajax переключением страниц, на моб версии стоит бургер-меню (которое открывается на весь экран поверх всего), необходимо что бы в открытом меню при клике на любую ссылку оно автоматически закрывалось, сейчас ситуация такая что при клике на меню, ссылка открывается но она остается под слоем меню и пока сам не закроешь бургер, ничего не увидишь. Сама кнопка открыть/закрыть это чекбокс, видимо какой то скрипт нужен что бы закрыть ее не нажимая именно на крестик а на ссылку меню. Help!

[].forEach.call(document.querySelectorAll('a'), function (el){
		el.addEventListener('click', function(){
			document.querySelector('input[type="checkbox"]').checked = false;
		});
	});

только свои селекторы укажите

Цитата:

Сообщение от j0hnik (Сообщение 480068)

[].forEach.call(document.querySelectorAll('a'), function (el){
		el.addEventListener('click', function(){
			document.querySelector('input[type="checkbox"]').checked = false;
		});
	});

только свои селекторы укажите

Большое спасибо! Только не совсем понял где селекторы указывать? и к этому коду больше ничего не нужно добавлять кроме селекторов?

к 'a' класс ссылок или что у вас там, к 'input[type="checkbox"]' тоже самое, id чекбокса желательно.

Цитата:

Сообщение от j0hnik (Сообщение 480089)

к 'a' класс ссылок или что у вас там, к 'input[type="checkbox"]' тоже самое, id чекбокса желательно.

Извиняюсь за тупость, возможно что-то делаю не так, но не работает.

Это добавил в head

<script type="text/javascript">
    [].forEach.call(document.querySelectorAll('a#stoa'), function (el){
    el.addEventListener('click', function(){
      document.querySelector('input[type="checkbox"]#stoa').checked = false;
    });
  });
    </script>

Это код меню

<label id="menu">
  <input type='checkbox' class="stoa">
  <span class='menus'>
    <span class='hamburgers'></span>
  </span>
  <ul>
    <li>
    <a href="<?php bloginfo('template_url'); ?>/football.html" class="js-click-modal stoa">Футбол</a>
    </li>
    <li>
    <a href="<?php bloginfo('template_url'); ?>/hockey.html" class="js-click-modal stoa">Хоккей</a>  
    </li>
    <li>
    <a href="<?php bloginfo('template_url'); ?>/basket.html" class="js-click-modal stoa">Баскетбол</a>
    </li>
    <li>
    <a href="<?php bloginfo('template_url'); ?>/boks.html" class="js-click-modal stoa">Бокс</a> 
    </li>
  </ul>
</label>

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
<label id="menu">
  <input type='checkbox' class="stoa" checked>
  <span class='menus'>
    <span class='hamburgers'></span>
  </span>
  <ul>
    <li>
    <a href="<?php bloginfo('template_url'); ?>/football.html" class="js-click-modal stoa">Футбол</a>
    </li>
    <li>
    <a href="<?php bloginfo('template_url'); ?>/hockey.html" class="js-click-modal stoa">Хоккей</a>  
    </li>
    <li>
    <a href="<?php bloginfo('template_url'); ?>/basket.html" class="js-click-modal stoa">Баскетбол</a>
    </li>
    <li>
    <a href="<?php bloginfo('template_url'); ?>/boks.html" class="js-click-modal stoa">Бокс</a> 
    </li>
  </ul>
</label>
	<script>
    [].forEach.call(document.querySelectorAll('#menu a'), function (el){
    el.addEventListener('click', function(e){
    	e.preventDefault(); // эту не надо
      document.querySelector('input[type="checkbox"].stoa').checked = false;
    });
  });
	</script>
</body>
</html>

скрипт в конец

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