Solo soy un novato en javascript, estoy usando formularios de varias líneas y no puedo encontrar la razón por la cual mi página se vuelve a cargar cuando hago clic en el botón desplegable y sigue volviendo a la primera página de mi formulario.
aquí está mi código en el menú desplegable
<div class="container3"> <button class="click" name="drop" href="#"> Select hours </button> <div class="list"> <button class="links" href="#">6 Hours</button> <button class="links" href="#">8 Hours</button> <button class="links" href="#">10 Hours</button> <button class="links" href="#">16 Hours</button> <button class="links" href="#">20 Hours</button> </div> </div>aquí está el javascript:
<script> let click = document.querySelector('.click'); let list = document.querySelector('.list'); click.addEventListener("click", ()=>{ list.classList.toggle('newlist'); }); </script>Primero elimine la propiedad href de las etiquetas de los button .
href es una propiedad de a etiqueta.
y si desea cancelar el evento del botón, agregue esto a su código event.preventDefault()
aquí un ejemplo:
<script> let click = document.querySelector('.click'); let list = document.querySelector('.list'); click.addEventListener("click", (event)=>{ event.preventDefault() list.classList.toggle('newlist'); }); </script>