Код JavaScript не работает над Mozilla Firefox

Question

Он работает как очарование Chrome (последняя версия), IE и Edge (я должен разрешить JavaScript в IE и Edge для работы).

Этот код просто проверяет электронное письмо, если оно правильно, то оно отправляет форму, если она неверна, предотвращает действие формы.

function validateEmail(email) { 
 
    var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
 
    return re.test(email); 
 
} 
 

 
function validate() { 
 
    var email = $("#email").val(); 
 
    if (validateEmail(email)) { 
 

 
     event.preventDefault(); 
 
     setTimeout(function() { 
 
      $("#cpa-form").submit(); 
 
     }, 5000); 
 
     $("#error").text('Well done'); 
 
     $("#error").css({ 
 
      'background-color': '#dff0d8', 
 
      'color': '#3c763d', 
 
      'border-color': '#d6e9c6', 
 
      'position': 'absolute', 
 
      'padding': '15px', 
 
      'margin-top': '5px', 
 
      'margin-bottom': '5px', 
 
      'border': '1px solid transparent', 
 
      'border-radius': '4px' 
 

 
     }); 
 
    } else { 
 
     event.preventDefault(); 
 
     $("#error").text('Something went wrong'); 
 
     $("#error").css({ 
 
      'background-color': '#f2dede', 
 
      'color': '#a94442', 
 
      'border-color': '#ebccd1', 
 
      'position': 'absolute', 
 
      'padding': '15px', 
 
      'margin-top': '5px', 
 
      'margin-bottom': '5px', 
 
      'border': '1px solid transparent', 
 
      'border-radius': '4px' 
 

 
     }); 
 

 
    } 
 
    return false; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> 
 
<form id="cpa-form"> 
 
     <input type="email" id="email" name="email" value="email"> 
 
     <br><br> 
 
     <button onclick="validate()" >button</button> 
 
    
 
    </form> 
 
    <span id="error"></span>

Answer 1

Прекратите использование глупые звонки из внутри HTML, и определяется event в функции-вызова. См. Обновленный JS-код в фрагменте.

function validateEmail(email) { 
 
    var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
 
    return re.test(email); 
 
} 
 

 
$('button').click(function(event) { 
 
    var email = $("#email").val(); 
 
    if (validateEmail(email)) { 
 

 
     event.preventDefault(); 
 
     setTimeout(function() { 
 
      $("#cpa-form").submit(); 
 
     }, 5000); 
 
     $("#error").text('Well done'); 
 
     $("#error").css({ 
 
      'background-color': '#dff0d8', 
 
      'color': '#3c763d', 
 
      'border-color': '#d6e9c6', 
 
      'position': 'absolute', 
 
      'padding': '15px', 
 
      'margin-top': '5px', 
 
      'margin-bottom': '5px', 
 
      'border': '1px solid transparent', 
 
      'border-radius': '4px' 
 

 
     }); 
 
    } else { 
 
     event.preventDefault(); 
 
     $("#error").text('Something went wrong'); 
 
     $("#error").css({ 
 
      'background-color': '#f2dede', 
 
      'color': '#a94442', 
 
      'border-color': '#ebccd1', 
 
      'position': 'absolute', 
 
      'padding': '15px', 
 
      'margin-top': '5px', 
 
      'margin-bottom': '5px', 
 
      'border': '1px solid transparent', 
 
      'border-radius': '4px' 
 

 
     }); 
 

 
    } 
 
    return false; 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="cpa-form"> 
 
     <input type="email" id="email" name="email" value="email"> 
 
     <br><br> 
 
     <button>button</button> 
 
    
 
    </form> 
 
    <span id="error"></span>