無法通過JavaScript驗證我的“代碼”

Question

好的，因此對於我的學校項目，我需要創建一個頁面，該頁面具有一個表單以某種格式輸入比賽代碼，使用JavaScript進行驗證並顯示“對不起”消息。 我相信我的一切都正確，但顯然我沒有像我在這里尋求幫助那樣。 似乎每次我嘗試提交代碼時，頁面都會刷新，而我的JSFiddle測試返回一個錯誤的錯誤。 任何幫助，將不勝感激。 我在下面使用的代碼帶有兩個JSFiddle鏈接，一個僅包含我的代碼，一個包含我所有的HTML和JavaScripting：

<script type="text/javascript">
$('.code_input').on('submit', function(e) {
    e.preventDefault();
    if ($('.code', this).val().match(/^[0-9]{6}\-[0-9]{6}\-[a-z]$/)) {
        alert('Sorry, you did not win.');
    }else{
        alert('Not a valid code. Please try again.')
    }
}); // reference point
</script>

<section class="code_input">
  <form method="post">
    <input type="text" class="code" name="code" placeholder="Type Code Here" />
    <input id="submit" type='submit' value='Check Number'>
  </form>
</section>

JSFiddle-只是代碼
JSFiddle-所有代碼

Answer 1

https://jsfiddle.net/azhzpLct/

document.querySelector('form').addEventListener('submit', function(e) {
    e.preventDefault();
    if (document.querySelector('.code').value.match(/^[0-9]{6}\-[0-9]{6}\-[a-z]$/)) {
        alert('Sorry, you did not win.');
    }else{
        alert('Not a valid code. Please try again.')
    }
});