JS onclick pourquoi ma page se refresh??

Par lGatl, il y a 9 ans


Bonjour les amis,
Je cherche à utiliser un bouton en js sans utiliser jquerry...
J'avais deja réussi à contourner le problème il y a 2 ans dans un autre projet.
Mais aujourd'hui, je veux bien comprendre, alors apres 2 jours de recherche intensive dans les forums, me voici.

console.log("erzrzrezrz") var bt=document.getElementById('bt') bt.onclick=function(){init()} var init = function(){ console.log("TEST") /* conv=mev(conv) converter(conv) aff(conv)*/ }

mon bouton à un id="bt"
au lancement du html
mon premier console.log s'affiche, normal.
quand je clique le second console.log s'affiche, mais disparait direct aprés!!!!!!!!!
POURQUOI??? :'(
Aaaaaaaaaaaah je suis trop un noob! :)

Merci d'avoir lu ce post.

4 réponses

Defy, il y a 9 ans

parceque un bouton submit rafraichi ta page automatiquement, pour palier a ce comportement il suffit de faire un truc du genre:

var bt=document.getElementById('bt') bt.addEventListener('click', function(e){ e.preventDefault(); "ton code à lancer au click" }

maintenant petite explication

pour gérer les evenement on passe pas par du onclick direct mais par des eventlistener ca te permet d'avoir un peut plus de controle.
le e en parametre de fonction représente l'event et le e.preventDefault()permet de couper l'effet de base du bouton et donc d'afficher ton console.log a la place de rafraichir la page.

lGatl, il y a 9 ans

Genial!!
Merci mille fois!!!!!

PhiSyX, il y a 9 ans

Tu peux pallier à ce problème en y mettant un type à ton boutton, qui est plus recommandable (a11y).
<button id="bt" type="button">Test</button>.

Defy, il y a 9 ans

de rien ;-) pour informations il y as une formation dédié au debutant pour le javascript sur grafikart