Javascriptフォーム検証エラー

Question

検証用にJavascriptを使用する基本的な購読フォームを構築していますが、正しく動作していません。

マイフォームのコードは次のとおりです。

<form id="pageSubscribeForm"> 
    <div class="pageSubscribeCell"> 
     <input id="pageSubscribeName" type="text" class="pageSubscribeInput" value="Tell Us Your Name" /> 
    </div> 
    <div class="pageSubscribeCell"> 
     <input id="pageSubscribeEmail" type="text" class="pageSubscribeInput" value="Add Your Email Address" /> 
    </div>   
    <div class="pageSubscribeCell hidden"> 
     <input id="pageSubscribeSpam" type="text" class="pageSubscribeInput" value="" /> 
    </div> 
    <div class="pageSubscribeCell"> 
     <div class="pageSubscribeButton"> 
      <div id="pageSubscribeSubmit" class="pageSubscribeAction"></div> 
     </div> 
    </div> 
</form> 

と検証コードは次のとおりです。

$("#pageSubscribeSubmit").click(function() { 
var name = $("#pageSubscribeName").val(); 
var nameok = 0; 
var email = $("#pageSubscribeEmail").val(); 
var emailok = 0; 
var spam = $("#pageSubscribeSpam").val(); 
var spamok = 0; 
var dataString = 'name='+ name + '&email=' + email + '&spam=' + spam; 

if(name!='Tell Us Your Name'){ 
    nameok = 1 
}else{ 
    $("#pageSubscribeName").removeClass("subscribeSuccess").addClass("subscribeError"); 
} 

if(email!='Add Your Your Email Address'){ 
    emailok = 1 
}else{ 
    $("#pageSubscribeEmail").removeClass("subscribeSuccess").addClass("subscribeError"); 
} 

if(spam ==''){ 
    spamok = 1 
}else{ 
    $("#pageSubscribeSpam").removeClass("subscribeSuccess").addClass("subscribeError"); 
} 

if(nameok == 1 && emailok == 1 && spamok == 1){ 
    $('#pageSubscribeSubmit').hide(); 
} 

私はsubmitリンクをクリックすると、私は私の名前のセルに追加のエラークラスが、電子メールのセルを取得同じままで、スパムセルは隠れたままです。理由や解決方法は？このような問題を回避するには、コードを修正する（メール！=「あなたのあなたのメールアドレスを追加」）場合は、「あなた」の試験

第二を削除するには

Answer 1

を働くあなたのあなたのテストが間違ったテキストをチェックしているので、電子メールフィールドは、（2X「あなた」）エラークラスを取得できません：あなたはまた、なぜ尋ね

if(email!='Add Your Your Email Address'){ 

「...スパムセルが隠されたまま...」。 #pageSubscribeSpamのdivから.hiddenクラスを削除するコードは何もありません。 .hiddenクラスが示唆していることを仮定すると、#pageSubscribeSpam入力はページの読み込み時に非表示になります。ユーザーが値を入力する方法はないため、ボタンをクリックしても値は ''です。だからspamok = 1、常に - それは.subscribeErrorクラスが追加されることはありません。

Answer 2

{

私は強く何かを示唆このよう

$(function() { 
 
    $("#pageSubscribeSubmit").on("click", function() { 
 
    var name = $.trim($("#pageSubscribeName").val()); 
 
    var email = $.trim($("#pageSubscribeEmail").val()); 
 
    var spam = $("#pageSubscribeSpam").val(); 
 
    var dataString = 'name=' + name + '&email=' + email + '&spam=' + spam; 
 

 
    $("#pageSubscribeName").toggleClass("pageSubscribeError", name == ""); 
 
    $("#pageSubscribeEmail").toggleClass("pageSubscribeError", email == ""); 
 

 
    var spamok = spam == $("#pageSubscribeSpam").get(0).defaultValue; // nothing changed 
 
    $("#pageSubscribeSpam").toggle(!spamok); 
 

 
    if (spamok && $(".pageSubscribeError").length == 0) { // no errors 
 
     $('#pageSubscribeSubmit').hide(); 
 
     $.ajax({ 
 
     type: "POST", 
 
     url: "php/subscribe.php", 
 
     data: dataString, 
 
     success: function() { 
 
      $('#pageSubscribeSubmit').slideUp(); 
 
     } 
 
     }); 
 
    } 
 
    }); 
 
});

.pageSubscribeError { border:1px solid red } 
 
#pageSubscribeSpam { display:none }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<form id="pageSubscribeForm"> 
 
    <div class="pageSubscribeCell"> 
 
    <input id="pageSubscribeName" type="text" class="pageSubscribeInput" value="" placeholder="Tell Us Your Name" /> 
 
    </div> 
 
    <div class="pageSubscribeCell"> 
 
    <input id="pageSubscribeEmail" type="text" class="pageSubscribeInput" value="" placeholder="Add Your E-Mail Address" /> 
 
    </div> 
 
    <div class="pageSubscribeCell hidden"> 
 
    <input id="pageSubscribeSpam" type="text" class="pageSubscribeInput" value="khujh" /> 
 
    </div> 
 
    <div class="pageSubscribeCell"> 
 
    <div class="pageSubscribeButton"> 
 
     <div id="pageSubscribeSubmit" class="pageSubscribeAction">Submit</div> 
 
    </div> 
 
    </div> 
 
</form>