jquery 完成表單驗證(1)確認必留欄位不為空

02-02

確認必留欄位不為空

<!DOCTYPE HTML>n<html>n<head>n <meta charset="UTF-8" lang="en">n <script src="jquery-3.2.1.min.js"></script>n <script type="text/javascript">n $(document).ready(function () {n $(.error).hide();n $(.submit).click(function (event) {n var data = $(.infobox).val;n var len = data.length;n if (len<1) {n $(.error).show();n event.preventDefault();n }n else{n $(.error).hide();n }n });n });n n </script>n <style>n .label{n float: left;n width: 120px;n }n .infobox{n width: 200px;n }n .error{n color: red;n padding-left:10px ;n }n .submit{n margin-left: 125px;n margin-top: 10px;n }n </style>n</head>n<body>n<form id="signup" method="post" action="">n <div>n <span class="label">n User id*n <input type="text" class="infobox" name="userid"/>n </span>n <span class="error">n this field cant be blankn </span>n </div>nn <input type="submit" class="submit" value="Submit">n</form>n</body>n</html>n