-1
간단한 PHP 폼을 작성하고 jQuery를 사용하여 유효성을 검사했습니다. 놀랍게도 유효성 검사는 IE 버전 "11.0.9600.18163" 에서 올바르게 작동하지만 Chrome 버전 "55.0.2883.87"에서는 작동하지 않습니다. 양식을 값없이 제출할 수 있음을 의미합니다.jQuery는 IE에서 작동하지만 Chrome에서는 작동하지 않습니다.
PHP 페이지 :
<!DOCTYPE HTML>
<html>
<head>
<title>Event Certificate System</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="normalize.css">
<link rel="stylesheet" type="text/css" href="enStyle.css">
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<!-- jQuery Validation Plugin
hosted by Google API -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<!-- jQuery Library -->
<script type="text/javascript" src="jquery.validate.min.js"></script>
<script type="text/javascript" src="addEvent-validation.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script type="text/javascript">
$(function(){
$("#datepicker").datepicker({dateFormat: 'yy-mm-dd'});
});
</script>
</head>
<body>
<div id="wrapper">
<div id="header"><img id="all" src="img/enHeader.png" alt="Event Certificate System"/></div>
<nav id="primary_nav_wrap">
<ul>
<li class="current-menu-item"><a href="index.php"><span>Home</span></a></li>
<li class="current"><a href="AddEvent.php"><span>Add Event</span></a></li>
<li class="current-menu-item"><a href="addAttendance.php"><span>Add Attendance</span></a></li>
<li class="cust"><a href="sendCertificate.php"><span>Send Certificate</span></a></li>
</ul>
</nav>
<br>
<div id="content">
<h3 class="custom">Add Event Form</h3>
<form action="addEvent.php" method="post" enctype="multipart/form-data" id="addEvent-form" novalidate>
<div class="formLayout">
<div class="required">
<label>Event Title</label>
<input type="text" name="etitle" dir="ltr"/>
</div>
<br>
<div class="required">
<label>Event Date</label>
<input type="text" name="edate" id="datepicker">
</div>
<br>
<input type="submit" name="add" value="Add" class="styled_button"/>
</div>
</form>
</div>
<div id="footer"> <img id="bottom" src="img/footer.png" alt="Event Certificate System"/> </div>
</div>
</body>
</html>
jQuery를이 : 나는 당신을 위해 작업 DEMO 만든
(function($,W,D)
{
var JQUERY4U = {};
JQUERY4U.UTIL =
{
setupFormValidation: function()
{
$("#addEvent-form").validate({
errorElement: 'div',
rules: {
etitle:
{
required: true,
},
edate:
{
required: true,
},
},
messages: {
etitle:
{
required: "Enter Event Title",
},
edate:
{
required: "Enter Event Date",
},
},
submitHandler: function(form) {
form.submit();
}
});
}}
$(D).ready(function($) {
JQUERY4U.UTIL.setupFormValidation();
});
})(jQuery, window, document);
'enctype'을 제거하여 작동하는지 확인하십시오. –
해결되지 않았습니다. – Learner
'바이올린'을 만들 수 있습니까? –