How to make the button available for clicking to populate a field?

Good afternoon.
I have a page with a form where the user can enter data.
It looks thus:
And here is its code:
<form method="POST" action="mysql.php" id="analytics" class="callback form-order">
<input type="text" name="name" placeholder="Name" required>
<p>last Name:</p>
<input type="text" name="surname" placeholder="last Name" required>
<p>middle name:</p>
<input type="text" name="second_name" placeholder="first name">
<input type="text" name="phone" placeholder="Phone number" required>
<a href="#" class="button button-o btn-hext">Continue</a>
<p>Birth date:</p>
<input type="text" name="birthdate" placeholder="date of birth" required>

Ie I have after clicking "continue" the remaining fields of the form.
How do I make the "continue" button did not work if fields with a required attribute is not filled?
March 20th 20 at 11:47
2 answers
March 20th 20 at 11:49
in haste such a decision:
hang on, the button class is inactive
.is inactive {
pointer-events: none;

when filling out the check, filled in fields, if Yes — remove this class
$('#analytics 'input').keyup(function() {
 var emptyFields = $('#analytics 'input:required').filter(function() {
 return $.trim(this.value) === ";
 if (!emptyFields.length) {
 console.log('form has been filled');
 $('#analytics .button').removeClass('inactive');
This is roughly what I was looking for, thank you) - trycia.Heathcote70 commented on March 20th 20 at 11:52
March 20th 20 at 11:51
Make the button a submit input and code validation fields on the script, and set the condition until validation input will not work, the button is disabled, I did not read about the rest, then make it easier, remove button display non, and yet not pass the validation field, the button will be hidden.
If he did not want to write the script for validation, the Internet is full of templates, just add the condition. Supposedly, when validation is true, then display the block on the button

Find more questions by tags CSSJavaScriptHTML