Email Invalid > Need user to stay on the same page

I created an web form that captures users email addresses. I have set up the conditions that need to be met in order for a user to be able to submit their email address and I am able to successfully return error messages.

However, if a user produces inputs an invalid code, they are still directed to the next screen after they close out the error.

HTML:

<form class="watch-films" onsubmit="location.href='thankYou_watch.html'">
            <p class="paid_in_full">Email</p>
            <input class="field2" name="viewerEmail" id="viewerEmail" placeholder="youremail@example.com" required>
            <div>
                <button type="submit" class="button_done" value="submit">Submit</button>
            </div>
        </form>

Javascript:

const watchForm = document.querySelector('.watch-films'); 
const feedback = document.querySelector('.feedback'); 
const viewerEmailPattern = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/; 


watchForm.addEventListener('submit', e=> {
    e.preventDefault(); 
    //validation
    const viewerEmail = watchForm.viewerEmail.value; 

    if(viewerEmailPattern.test(viewerEmail)){
      return (true)
    } else {
      alert("You have entered an invalid email address!")
      return (false); 
    }

    console.log(watchForm.viewerEmail.value);
});  

Appreciate any help!