jQuery基本表单验证问题

Question

在关注在线视频课程后，我遇到了简单联系表格的基本表格验证问题。

$("form").submit(function (e) {

    e.preventDefault();

    var error = "";

    if ($("#subject").val() == ""); {

    error += "<p>The subject area is required</p>";

    }

    $("#error").html(error);    

});

当我点击提交时，错误消息“主题区域是必需的”，显示在ID为“错误”的div中，这很好但是无论我的表单的主题框中是否有文本，它都会发生问题出在哪里。

我花了一段时间看，但没有太多运气。 我知道有一个jQuery插件可能是表单验证的更好选择，但是，我仍然是一个新手并且热衷于让它工作。

任何帮助将不胜感激！

Answer 1

检查JQuery自定义验证代码

 $(function() { $("#myForm").submit(function(e) { e.preventDefault(); var fname = $('#fname').val(); if(fname.length >= 0) { $("#error").html('<font color="red">First Name is required</font>'); } }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <form action="" method="POST" id="myForm"> first name <input type="text" name="fname" id="fname" > <span id="error"> </span> <input type="submit" nmae="submit" value="submit"> </form> 

Answer 2

试试这个JQuery验证码

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script> $(function() { $("#error").hide(); $("#myForm").submit(function(e) { e.preventDefault(); var fname = $('#fname').val(); if(fname.length == 0) { $("#error").show(); } else { $("#error").hide(); } }); }); </script> 

  <form action="" method="POST" id="myForm"> first name <input type="text" name="fname" id="fname" > <div id="error">First Name is required</div> <input type="submit" name="submit" value="submit"> </form>