Jquery和聯繫表單驗證

我想將驗證規則添加到聯繫人窗體的電子郵件部分，以便該字段不是空白並且是有效的電子郵件地址。Jquery和聯繫表單驗證

我該如何做到這一點？

我還想添加表單提交後發送給用戶的自動回覆嗎？

$("#ContactForm").submit(function() { 
    $.ajax({ 
     type: "POST", 
     url: "{homepage}mailer/mailer.php", 
     data: $(this).serialize(), 
     success: function(data){ 
      $('#fancybox-content #quote_box #ContactForm').html('<div style="padding-top: 15px; text-align:center;">Message Sent! Thank you.</div>'); 
      setTimeout(function(){ 
       $.fancybox.close(); 
      },3500); 
     } 
    }); 
}); 

<form id="ContactForm" name="ContactForm" action="{homepage}mailer/mailer.php" method="post"> 
    <input type="hidden" name="_sendto" value="[email protected]"> 
    <input type="hidden" name="_subject" value="Quote Request"> 
    <label for="name">Name</label><input type="text" name="name"><br> 
    <label for="title">Title</label><input type="text" name="title"><br> 

    <label for="customer_segment">Customer segment</label><input type="text" id="customer_segment" name="customer_segment" value=""><br> 
    <label for="company">Company</label><input type="text" name="company"><br> 
    <label for="email">Email</label><input type="text" name="email"><br> 
    <label for="phone">Phone</label><input type="text" name="phone"><br> 
    <label for="city">City</label><input type="text" name="city"><br> 
    <label for="state">State</label><input type="text" name="state"><br> 
    <label for="country">Country</label><input type="text" name="country"><br> 
    <label for="contact_interested_in">Product interested in</label><input type="text" name="prod_inquiry" value="{exp:cookie_plus:get name="" parse="inward"}{exp:channel:entries entry_id="{cookie}"}{title}{/exp:channel:entries}{/exp:cookie_plus:get}"><br> 
    <label for="contact_preference">Contact preference</label> 
    <input class="radio" type="radio" name="contact_preference" value="Phone"> <span class="label">Phone</span> 
    <input class="radio" type="radio" name="contact_preference" value="Email"> <span class="label">Email</span><br> 
    <input id="button" type="submit" value="Submit" /> 
</form>

請注意，我沒有創建這個代碼不是很熟悉的話，我們有一個開發公司建立我們的網站，我只是試圖擴大它來滿足我們的需求，我只需要一點點的方向。

來源

2011-07-15 Michael Quiles

使用Jquery驗證插件http://docs.jquery.com/Plugins/Validation#List_of_built-in_Validation_methods。然後在你的成功創建一個div並添加一個成功的短語tit titan – Brad

看看http://unwrongest.com/projects/valid8/（大約有500個「表單驗證」插件）。這只是我最喜歡的，因爲它非常苗條和簡單。

來源

2011-07-15 14:36:15 Steven

這是另一個好的：http://docs.jquery.com/Plugins/validation –

用if語句括起您的$ .ajax調用，該語句用正則表達式檢查電子郵件輸入值。谷歌「正則表達式電子郵件JavaScript」，你會發現你所尋求的。

注意雖然在javascript中驗證表單並不是很安全，因爲任何具有一些編程知識的人都可以通過直接發佈到您的php腳本來檢查頁面的源代碼並繞過驗證。最好在「mailer.php」中進行驗證，將任何錯誤返回給您的$ .ajax success-callback，並使用javascript向用戶顯示錯誤消息。

來源

2011-07-15 14:45:05 Sebastian

如果您嘗試根據您在谷歌上找到的正則表達式驗證電子郵件地址，請小心。 AFAIK，沒有一個正則表達式可以根據RFC 2822正確驗證電子郵件地址。大部分你會發現那裏會不正確地拒絕有效的電子郵件地址或接受無效的電子郵件地址。 最接近我找到的正則表達式是一頁半長打印出來的。

編輯：

例如，所有的這些都是有效的電子郵件地址，如果您要驗證的電子郵件地址的所有的這些都應該被允許：

美國廣播公司\ @ DEF「@ example.com
」弗雷德布羅格斯「 @ example.com
"Joe\Blow"@example.com
"[email protected]"@example.com
customer/[email protected]
[email protected]
!def!xyz%[email protected]
_somename @例子。COM

來源

2011-07-15 15:03:52

嗯，我不確定在jQuery發佈5年之前發佈的文章已經有效了。有很多進步和規格的變化。電子郵件只能包含有限數量的不同字符，所以它是可能的。 – Steven

這不是一篇文章，它是一個標準，與JavaScript或jQuery完全無關，而是定義了什麼使得有效的電子郵件地址。 –

既然你不熟悉的第三方開發者的工作，該網站是建立與ExpressionEngine，你可能會考慮與流行Solspace Freeform Module更換自定義表單處理器：

自由形式允許您在您的網站上創建簡單而靈活的表格，以便從您的用戶收集信息到。

張貼到您的表格被記錄和組織在您的EE數據庫中作爲以及可選地郵寄到您提供的通知電子郵件。

您可以接收從遞交附件，並有存儲在數據庫中，以及郵寄回了作爲附件發送到管理員或提交用戶使用這些附件。

在它的許多功能，自由形式提供服務器端表單驗證，通知和確認電子郵件和CAPTCHA集成 - 作爲獎金，自由形式是免費的，its features are well-documented。

您甚至可以使用jQuery Validation Plugin和Freeform一起提供客戶端數據驗證或使用異步HTTP（Ajax）請求提交表單。

來源

2011-07-15 15:18:47 rjb

Jquery和聯繫表單驗證

回答

相關問題