Question

我正在寻找验证<Form onsubmit="return validate();">上的姓名和电子邮件输入的代码

我希望该用户名只有A-Z，a-z且必须有一个下划线_，电子邮件应该有一个@。我怎么能用jQuery做到这一点？

表格（例如）：

<html>
<head>
<title>TEST</title>
</head>
<body>
<form action="..." method="POST" onSubmit="return Check()" >
<input type="text" id="name" placeholder="Please enter your Name. (Must have underscore)" required>
<input type="text" id="email" placeholder="E-Mail">
<input type="submit" value="submit">
</form>
</body>
</html>

编辑我已尝试过：

<script type="text/javascript">
    jQuery(document).ready(function($){
        $('[name="submit"]').click(function(e){
        var name = document.getElementById("name").value;
        if(re = /[a-zA-Z]*_[a-zA-Z]*/;) {
            $(".name").addClass("error");
            return false;
        } else {
            $(".name").removeClass("error");
            $(".name").addClass("success");
            return true;
        }
        });
    });

谢谢！

Answer 1

有效的电子邮件地址： Validate email address in JavaScript?

对于您的用户名是相同的，但您的正则表达式应该是这样的：

re = /^[a-zA-Z]*_[a-zA-Z]*$/; //this always needs an underscore to be valid.

以防万一，这是正则表达式接受任何az AZ和_而且没有，这取决于你的要求：

re = /^[a-zA-Z_]*$/;
re = /^[a-zA-Z_]{3,}$/; //3 or more chars

测试你的正则表达式：

re = /^[a-zA-Z_]*$/;
return re.test('any_string_to_test'); //it returns true if your string is valid

Answer 2

将regex与jquery一起使用：

将字符串传递给RegExp或使用//语法调用
regex.test（string）not string.test（regex）

在您的代码中：

$(".name").on('keyup', function(e)
{
    var name = $(this).val();
    if(new RegExp(/^[a-zA-Z_]+$/i).test(name)) // or with quotes -> new RegExp("^[a-zA-Z_]+$", 'i')
        $(this).addClass("error");
    else
        $(this).switchClass("error", "success", 1000, "easeInOutQuad");

    e.preventDefault();
    e.stopPropagation(); // to avoid sending form when syntax is wrong
});

对于电子邮件输入，以下正则表达式可以完成这项工作：

/^[+a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i

或..

为了提供一点现代性，您可以使用html5 email field type

<input type="email" id="email">

Answer 3

现在使用HTML5的高级功能即可，您可以按照以下方式进行验证：

       Sending Email func async parallel to works fine

检查HERE以获取HTML5的更多表单验证功能。

Answer 4

@Polak我试过了，如果我理解你的意思：x抱歉我是javascript的新手。

<script type="text/javascript">
    jQuery(document).ready(function($){
        $('[name="submit"]').click(function(e){
            var name = document.getElementById("display_name").value;

            re = /[a-zA-Z]*_[a-zA-Z]*/;
            if (re.test(name) {
                //Things to do when the entry is valid.
                $(".NameCheck").removeClass("name_error");
                $(".NameCheck").addClass("name_success");
                return true;
            } else {
                //Things to do when the user name is not valid.
                $(".NameCheck").addClass("name_error");
                return false;
            });
        });
    });

名称，电子邮件验证

4 个答案: