效果:
在點擊提交按鈕時,首先進行js判斷, 如果不符合條件,則alert出提示信息,并return false.
主要點就在于給form表單添加一個onsubmit事件. 在onsubmit事件中定義的函數里進行js驗證處理.
代碼 :?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="/static/layui/css/layui.css">
<script src="/static/layui/jquery.min.js"></script>
<script src="/static/layui/layui.js"></script>
</head>
<body>
<div id="up_image">
<form action="" method="post" enctype="multipart/form-data" οnsubmit="return verify()">
<br>
<br>
<br>
<p>請上傳發票: <input type="file" name="invo" value="" id="file"></p><br/><br />
<p>快遞單號: <input type="text" name="OrderNu" value="" id="OrderNu" /></p><br />
<p>快遞公司: <input type="text" name="Expre" value="" id="Expre"/></p><br />
<input type="submit" value="提交" style="width: 140px;height:40;color:red;margin-top: 30px;margin-left: 130px;">
</form>
</div>
</body>
</html>
<script type="text/javascript">
function verify() {var file = $("#file").val();
var order = $("#OrderNu").val();
var Expre = $("#Expre").val();
if (file == '' || file==null) {alert('請上傳發票');
return false;
}if(order==''){alert('請補全快遞單號');
return false;
}if(Expre==''){alert('請填寫快遞公司');
return false;
}}
</script>