JavaScript代码无法在Mozilla Firefox

Question

它在Chrome（最新版本），IE和Edge上的魅力（我必须在IE和Edge上允许JavaScript才能工作）。

此代码只是验证电子邮件是否正确，然后提交表单如果错误则阻止表单操作。

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代码。

＆＃13;

＆＃13;

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;
})

＆＃13;

<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>

＆＃13;

＆＃13;

＆＃13;