私は、電子メールを検証し、ajaxを使用してフォームを送信するためのjQuery関数を一緒に冠しました。これまでの検証機能は正常に動作しています(エラーメッセージが表示されます)jQuery + ajaxフォームの妥当性検査と捻挫による提出
ユーザーが有効な電子メールを入力した場合、私は自分のajax関数を実行します。有効なメールが入力されると成功メッセージが表示されますが、これは必要ありません.AJAXを実行するだけです。私は成功のメッセージを取り除こうとしたが、それはバグがあった。
要するに、電子メールの検証とajaxが独立して動作します。一緒に作業する必要があります。エラーの場合は、エラーメッセージを表示しますが、電子メールが有効になっている場合は、ajaxを実行します。
また、ここではjsfiddleだ - http://jsfiddle.net/NjDeb/
$(document).ready(function() {
$('.error').hide();
$('.success').hide();
$('input#email').css({backgroundColor:"#FFFFFF"});
$('input#email').focus(function(){
$(this).css({backgroundColor:"#FFDDAA"});
$('.success').hide();
$('.error').hide();
});
$('input#email').blur(function(){
$(this).css({backgroundColor:"#FFFFFF"});
});
$(".submit_button").click(function() {
function validateEmail(email) {
var email = $("input#email").val();
var filter = /^[a-zA-Z0-9_.-][email protected][a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{0,4}$/;
if(filter.test(email))
{
return true;
}
else
{
return false;
}
}
if(!validateEmail('email'))
{
$('.error').show();
return false;
}
else
{
$('.success').show();
return false;
}
$.ajax({
type: "POST",
url: "process.php",
data: email,
success: function() {
$('#signup').html("<div id='message'></div>");
$('#message').html("<h3>You're signed up. Look for an invite from us soon.</h3>")
.css({color:"#FFFFFF", fontFamily: "Exo, sans-serif", fontSize: "18px", marginTop: "10px", marginRight: "200px", fontWeight:"500"})
.hide()
.fadeIn(1500, function() {
$('#message').append("");
});
}
});
return false;
});
});
ありがとう、次のように行います。しばらくそれを見た後、私は気付かなかった。上書きされ、選択されました。 – chowwy