JavaScript28：表单验证_atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length-优快云博客

本文链接：https://blog.youkuaiyun.com/menglong0329/article/details/106107091

JavaScript 表单验证

JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。

表单数据经常需要使用 JavaScript 来验证其正确性：

验证表单数据是否为空？
验证输入是否是一个正确的email地址？
验证日期是否输入正确？
验证表单输入内容是否为数字型？

验证是否有输入：

    <script>
        function myFunction() {
            var str = document.forms["myform"]["fname"].value;
            if(str == null || str == ""){
                alert("请输入姓名");
                return false;
            }else{
                alert("输入正确");
                return false;
            }
        }
    </script>



<body>

    <p>
        请输入姓名：
    </p>

    <form name="myform">
        <input type="text" name="fname">
        <input type="submit" value="提交" onclick="myFunction()">
    </form>

</body>

E-mail 验证

下面的函数检查输入的数据是否符合电子邮件地址的基本语法。

意思就是说，输入的数据必须包含 @ 符号和点号(.)。同时，@ 不可以是邮件地址的首字符，并且 @ 之后需有至少一个点号：

function validateForm(){
  var x=document.forms["myForm"]["email"].value;
  var atpos=x.indexOf("@");
  var dotpos=x.lastIndexOf(".");
  if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length){
    alert("不是一个有效的 e-mail 地址");
    return false;
  }
}


<form name="myForm" action="demo-form.php" onsubmit="return validateForm();" method="post">
    Email: <input type="text" name="email">
    <input type="submit" value="提交">
</form>