Javascript HTML5验证不起作用

我已经做了一张联系表。在这个表单中，我在联系人文本框中添加了输入验证，如电子邮件文本框的电子邮件和电话号码10的最大长度。但这些验证在我的情况下不起作用。
我做错了什么

AJAX调用

function myformsubmit() {
    var name = document.getElementById("name").value;
    var mail = document.getElementById("mail").value;
    var contact = document.getElementById("contact").value;
    var reason = document.getElementById("reason").value;
    // Returns successful data submission message when the entered information is stored in database.
    var dataString = 'name1=' + name + '&mail1=' + mail + '&contact1=' + contact+ '&reason1=' + reason;

    if (name == ''||mail == ''|| reason == ''||contact == ''){
        alert("Please Fill all fields");
    }else{
        // AJAX code to submit form.
        $.ajax({
            type    : "POST",
            url     : "http://test1.com/wp-content/themes/suave/theme_option/1.php",
            data    : dataString,
            cache   : false,
            success : function(html) {
                alert(html);
                window.location="http://test1.com";
            }
        });
    }
    return false;
}

@媒体屏幕和（最大宽度：972px）和（最小宽度：100x）{
.exitpoup模式窗口{
显示：无；
}
}
#exitpoup模态。模态体{
填充：0px；
}
.模态体{
填充：0px；
}
.第二次img{
宽度：369px；
高度：404.6px；
利润上限：-1%；
}
.第一表格{
显示：表格；
左边距：34px；
边缘顶端：43像素；
}
.第1行{
字体大小：10px；
字体家族：继承；
显示：表格行；
边框：2倍纯红；
}
.row1#名称，
#邮寄，
#接触{
颜色：黑色；
宽度：260px；
高度：34px；
填充：6px 12px；
边界半径：3.9px；
边框颜色：#777；
显示：表格单元格；
}
.row1文本区{
宽度：260px；
高度：110px；
颜色：黑色；
边框颜色：#777；
显示：表格单元格；
}
.row1#提交{
宽度：152px；
高度：44px；
左边距：15%；
背景色：#337ab7；
颜色：白色；
边框颜色：无；
}
.row1#提交：悬停{
宽度：152px；
高度：44px；
左边距：15%；
背景色：白色；
颜色：#337ab7；
边框颜色：无；
}
第二
.首先{
浮动：左；
}
.clearfix{
清楚：两者都有
}
.第一跨{
左边缘：25%；
字体家族：继承；
字体大小：15px；
垫面：3件；
}
我们是来帮助你的

您的按钮类型应为submit

 <input id="submit"  type="submit" value="Submit">

在for标记中，您应该有操作

<form id="form" name="theform" action="javascript:myformsubmit()">

创建新函数并从函数myformsubmit调用此函数。

---

但是我想在提交按钮上提交表单click@Ruhul@雅利安：别担心，它只有在点击提交按钮时才会被提交，因为它有type=“submit”，所以当你点击按钮时，首先，它将进行验证，一旦验证成功，它将调用表单的操作submitted@Ruhuli你能试试这个吗，最终你想在点击提交按钮时调用java脚本函数，对吗？？？？

    function checkvalidate() {
    var flag = false;
    if (name == ''||mail == ''|| reason == ''||contact == ''){
            flag = false;
        }
else
{
flag = true;
}
    return flag;
    function myformsubmit() {
            var flag = checkvalidate();
            if(flag == true)
    {
    success code.
    }
    else
    {
    error message
    }

    }