I have an issue when clicking a button. My page reload and the message “MERCI, VEUILLEZ VÉRIFIER VOS MESSAGES” doesn’t display. I don’t know if these two issues are linked. I’m on WordPress, Chrome, with DIVI themes. and I don’t have error in console.
HTML:
<form class="formnumber">
<input class="inputsms" id="number" placeholder="ENTREZ VOTRE NUMÉRO" />
<button class="buttonsms" id="buttonsms">ENVOYER ></button>
</form>
JavaScript:
var button = document.getElementById('buttonsms');
if(button){
button.addEventListener('click', function(e) {
e.preventDefault();
this.classList.add('is-done');
setTimeout(function() {
button.innerHTML = "MERCI, VEUILLEZ VÉRIFIER VOS MESSAGES 😍"
}, 500);
});
}
You can see all the code with CSS and animation here
2
Answers
When I replace the HTML by
Animation and style before replacing:
image 1 image 2
Animation and style after replacing:
image 1 image 2
easy, set the button attribute to be onmousedown=”location.reload();”