1
我在我的页面上得到了一些表单验证，如果字段尚未完成，显示错误，但由于某种原因表单提交，即使字段是空的...我需要如果它们留空，则显示错误。冲突Javascript阻止表单验证
希望有人能看到这个问题，因为我不能:(
测试时，只有它自己似乎工作，所以我觉得有什么矛盾的吧：
这是我的表单页面的代码：
<script>
$(function() {
$("#datepicker").datepicker({
altField: '#date'
});
$('#submit').click(function() {
$('#output').html($('form').serialize());
});
});
</script>
<title>Can you guess when Ally McCoist will get the sack ???</title>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-9915379-4']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<div id="container">
<div id="topbar">
<p> </p>
</div>
<!-- close topbar -->
<div id="home">
<div id="home-header">
<div id="form-entry">
<form method="post" action="send.php" id="theform" name="theform">
<input type="text" name="firstname" id="firstname" value="First Name" onFocus="this.value=''" this.onfocus = null class="yourinfo" ><br/>
<input type="text" name="lastname" id="lastname" value="Last Name" onFocus="this.value=''" class="yourinfo"><br/>
<input type="text" name="email" id="email" value="Email Address" onFocus="this.value=''" class="yourinfo"><br/>
<span style="color:#FFF; font-family:Arial, Helvetica, sans-serif; font-size:12px;">Ally McCoist will be sacked on</span>
<div id="datepicker"></div>
<input type="hidden" name="date" id="date">
<input type="image" src="images/submit-button-small.png" name="submit" id="submit" value="submit" style="margin-top:10px; margin-left:-2px;" >
</form>
</div>
</div>
<img src="images/can-you-guess-big.png" width="826" height="146" alt="" />
<div id="bottom-social">
<table width="450" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="170" valign="top">
<img src="images/share-facebook-small.png" width="138" height="12" alt="share on facebook" style="margin-bottom:5px;"><br />
<script>function fbs_click() {u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;}</script><style> html .fb_share_link { padding:2px 0 0 20px; height:16px; background:url(http://static.ak.facebook.com/images/share/facebook_share_icon.gif?6:26981) no-repeat top left; }</style><a rel="nofollow" href="http://www.facebook.com/share.php?u=<;url>" onclick="return fbs_click()" target="_blank" class="fb_share_link"><img src="images/recommend.png" width="89" height="23" alt="Recommend on Facebook"></a>
</td>
<td width="144" valign="top">
<img src="images/share-twitter-small.png" width="116" height="12" alt="share on twitter" style="margin-bottom:5px;"><br/>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</td>
<td width="36" valign="top"><img src="images/share-google-small.png" width="119" height="14" alt="share on twitter" style="margin-bottom:5px;" /><g:plusone size="medium"></g:plusone></td>
</tr>
</table>
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</div>
</div><!-- close home -->
</div><!-- close container -->
</body>
</html>
这是使用即时通讯发送的DB代码：
<?php
//get the correct format
$new_date = date('Y-m-d',strtotime($_POST['date']));
mysql_connect ("localhost", "user", "pass") or die ('Error: ' . mysql_error());
mysql_select_db ("database");
$firstname = mysql_real_escape_string($_POST['firstname']);
$lastname = mysql_real_escape_string($_POST['lastname']);
$email = mysql_real_escape_string($_POST['email']);
$datepicker = mysql_real_escape_string($_POST['date']);
$query="INSERT INTO table (id, firstname, lastname, email, date)
VALUES (NULL, '".$firstname."', '".$lastname."', '".$email."', '".mysql_real_escape_string($new_date)."')";
mysql_query($query) or die (mysql_error());
header('Location: results.php');
?>
最后，这是验证码：
$(document).ready(function(){
// Place ID's of all required fields here.
required = ["firstname", "lastname", "email"];
// If using an ID other than #email or #error then replace it here
email = $("#email");
errornotice = $("#error");
// The text to show up within a field when it is incorrect
emptyerror = "Please fill out this field.";
emailerror = "Please enter a valid e-mail.";
$("#theform").submit(function(e){
//Validate required fields
for (i=0;i<required.length;i++) {
var input = $('#'+required[i]);
if ((input.val() == "") || (input.val() == emptyerror)) {
input.addClass("needsfilled");
input.val(emptyerror);
errornotice.fadeIn(750);
} else {
input.removeClass("needsfilled");
}
}
// Validate the e-mail.
if (!/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test(email.val())) {
email.addClass("needsfilled");
email.val(emailerror);
}
//if any inputs on the page have the class 'needsfilled' the form will not submit
if ($("input").hasClass("needsfilled")) {
e.preventDefault();
} else {
errornotice.hide();
}
});
// Clears any fields in the form when the user clicks on them
$(":input").focus(function(){
if ($(this).hasClass("needsfilled")) {
$(this).val("");
$(this).removeClass("needsfilled");
}
});
});
香港专业教育学院使用jQuery代码它的工作原理，但它打消了我的jQuery UI的日期选择器从页面完成，这并不真正帮助使香港专业教育学院不得不再次将其删除 – Gezzamondo
它definatley得到的东西做的Jquary UI日期选择器只是去尝试造成这个问题，但我无法制定什么 – Gezzamondo