2014-01-21 12 views
0

我使用elated.com的聯繫表單,我嘗試實現基本的數學驗證碼。但是,當我提交表單時,無論驗證碼是正確還是錯誤,它都會彈出錯誤驗證碼的錯誤消息,而不是提交表單。javascript captcha驗證部分返回整個表單而不是繼續

這部分代碼是一個我編輯:

function submitForm() { 
    var contactForm = $(this); 
    if (!$('#senderName').val() || !$('#senderEmail').val() || !$('#message').val()) { 

     $('#incompleteMessage').fadeIn().delay(messageDelay).fadeOut(); 
     contactForm.fadeOut().delay(messageDelay).fadeIn(); 

    } 
    // this is the part of the code I added the captcha verification. 
    if(('#captcha') != captcha_c) { 
     $("#captchaError").slideDown(500); 
     $("#captchaError").delay(messageDelay).slideUp(500); 
    } else { 

      $('#sendingMessage').fadeIn(); 
      contactForm.fadeOut(); 

      $.ajax({ 
      url: contactForm.attr('action') + "?ajax=true", 
      type: contactForm.attr('method'), 
      data: contactForm.serialize(), 
      success: submitFinished 
     }); 
    } 

    return false; 
} 

HTML表單:

<form id="contactForm" action="processForm.php" method="post"> 
    <h2>Send us an email...</h2> 
    <ul> 
     <li> 
      <label for="senderName">Your Name</label> 
      <input id="senderName" maxlength="40" name="senderName" placeholder="Please type your name" required="required" type="text" /> 
     </li> 
     <li> 
      <label for="senderEmail">Your Email Address</label> 
      <input id="senderEmail" maxlength="50" name="senderEmail" placeholder="Please type your email address" required="required" type="email" /> 
     </li> 
     <li> 
      <label for="message" style="padding-top: .5em;">Your Message</label> 
      <textarea id="message" cols="80" maxlength="10000" name="message" placeholder="Please type your message" required="required" rows="10"></textarea> 
     </li> 
     <li> 
      <label id="captcha" for="captcha"></label> 
      <input id="captcha" name="captcha" placeholder="Enter the captcha" required="required" type="text" /> 
      <script type="text/javascript"> 
       generate_captcha('captcha'); 
      </script> 
     </li> 
    </ul> 
    <div id="formButtons"> 
     <input id="sendMessage" name="sendMessage" type="submit" value="Send Email" /> 
     <input id="cancel" name="cancel" type="button" value="Cancel" /> 
    </div> 
</form> 
<div id="sendingMessage" class="statusMessage"> 
    <p>Sending your message. Please wait...</p> 
</div> 
<div id="successMessage" class="statusMessage"> 
    <p>Thanks for sending your message! We&#39;ll get back to you shortly.</p> 
</div> 
<div id="failureMessage" class="statusMessage"> 
    <p>There was a problem sending your message. Please try again.</p> 
</div> 
<div id="incompleteMessage" class="statusMessage"> 
    <p>Please complete all the fields in the form before sending.</p> 
</div> 
<div id="captchaError" class="statusMessage"> 
    <p>Are you sure about your calculations?</p> 
</div> 

如果我刪除了註釋部分,形式工作,並繼續發送電子郵件,我的javascript部分出錯了?

這裏是working live example

回答

1

更改此:

if(('#captcha') != captcha_c) { 

這樣:

if($('#captcha').val() != captcha_c) { 

你也有你的標籤作爲輸入,從而改變這個編號相同:

<label id="captcha" for="captcha"></label> 

<label id="something_else" for="captcha"></label> 
+0

更改爲建議的代碼但不起作用 – Nescafe

0

('#captcha')if(('#captcha') != captcha_c)之前忘了$跡象。

+0

更改爲建議的代碼但不工作 – Nescafe

+0

您可以使用console.log打印$('#captcha')。val()和captcha_c嗎? –

+0

我該怎麼做?我知道在PHP中我可以使用'var_dump()',但我是全新的JavaScript – Nescafe

相關問題