Question

我有一个脚本可以在单击“提交”按钮时验证表单中的“电子邮件”字段，并且所有内容都在 jsfiddle 上工作，但是当我实施时头像这样的脚本......

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">
$(document).ready(function(e) {
    $('#validate').click(function() {
        var sEmail = $('#mail').val();
        if ($.trim(sEmail).length == 0) {
            alert('Please enter valid email address');
            e.preventDefault();
        }
        if (validateEmail(sEmail)) {
        }
        else {
            alert('Invalid Email Address');
            e.preventDefault();
        }
    });
});

function validateEmail(sEmail) {
    var filter = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
    if (filter.test(sEmail)) {
        return true;
    }
    else {
        return false;
    }
}
</script>
</head>

好吧，没有任何反应。：（

我在这里做错了什么？

Answer 1

尝试在验证点击事件中返回false语句

    $(document).ready(function(e) {
         $('#validate').click(function() {
               var sEmail = $('#mail').val();
               if ($.trim(sEmail).length == 0) {
                   alert('Please enter valid email address');
                   e.preventDefault();
               }
               if (validateEmail(sEmail)) {
                   return true;
               }
               else {
                   alert('Invalid Email Address');
                   //e.preventDefault();
                   return false;
               }
         });
    });

希望得到这个帮助。

Answer 2

您必须为嵌入代码创建单独的标记。试试这个：

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">
</script>
<script type="text/javascript>
    $(document).ready(function(e) {
        $('#validate').click(function() {
            var sEmail = $('#mail').val();
            if ($.trim(sEmail).length == 0) {
                alert('Please enter valid email address');
                e.preventDefault();
            }
            if (validateEmail(sEmail)) {
            }
            else {
                alert('Invalid Email Address');
                e.preventDefault();
            }
        });
    });

    function validateEmail(sEmail) {
        var filter = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
        if (filter.test(sEmail)) {
            return true;
        }
        else {
            return false;
        }
    }
</script>
</head>

Answer 3

你需要做的事情很少。

首先关闭jquery URL脚本标记
将脚本放在结束正文标记之前的末尾。

Answer 4

您在错误的功能下遇到了事件对象。 JS CODE

    $(document).ready(function() {
    $('#validate').click(function(e) {
        var sEmail = $('#email').val();
        if ($.trim(sEmail) === '') {
            alert('Please enter valid email address');
            e.preventDefault();
        } else if (validateEmail(sEmail)) {
            alert("email is fine");
        } else {
            alert('Invalid Email Address');
            e.preventDefault();
        }
    });
});
function validateEmail(sEmail) {
    var filter = /^(([^<>()\[\]\\.,;:\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,}))$/;
    if (filter.test(sEmail)) {
        return true;
    }
    else {
        return false;
    }
}

HTML CODE

<input type='email' id='email'>
<button id='validate'>Validate</button>

jQuery Email Validator - 实施问题？

4 个答案: