jQuery - 用'謝謝信息'替換聯繫表格

我有一個執行PHP操作的聯繫表單。聯繫表單與jQuery中的驗證引擎連接。如果messege發送正確，我只需在感謝消息中包含PHP文件 - require_once('success.php');。發送郵件後，我想用謝謝信息替換聯繫人表單，而無需重新加載整個頁面。請給我一些建議如何去做。這裏是我的html：jQuery - 用'謝謝信息'替換聯繫表格

<div id="contactForm"> 
<form id="expertForm" class="formular" method="post" action="send.php"> 
    <fieldset> 
     <label> 
      <input name="email" 
        id="email" 
        class="required email" 
        type="text" 
        size="40"/> 
     </label> 

     <p> 
      <textarea name="body" id="body" rows="5" cols="50" class="required"></textarea> 
     </p> 
    </fieldset> 
    <input class="submit" 
      type="image" 
      src="../images/btn-send.png"/> 
</form> 
</div> 
<script type="text/javascript"> 
    $("#expertForm").validate(); 
</script>

在send.php我：

if(!$mail->Send()) { 
echo "Mailer Error: " . $mail->ErrorInfo; 
} else { 
    require_once('success.php'); 
}

來源

2011-10-05 mkas

你到目前爲止編碼了什麼？ –

你可以看到幾乎在這裏演示演示http://jsfiddle.net/v7MJA/1/

$(function(){ 
    $("#expertForm").submit(function(e){ 
     e.preventDefault(); 
     if(!$(this).validate().form()) return false; 
     $.ajax({ 
      url:$(this).attr('action'), 
      data:$(this).serialize(), 
      type:'post', 
      success:function(msg){ 
       $("#expertForm").replaceWith(msg); 
      } 
     }); 
    }); 
});

來源

2011-10-05 12:12:11 Usman

瞭解詳情我已經嘗試了您的解決方案。替換正確執行。但是驗證出現了問題。雖然並非每個表單輸入都被填充，並且驗證插件會調用錯誤（它們在頁面上顯示大約0.5秒），但會執行操作併發送電子郵件。我正在使用http://bassistance.de/jquery-plugins/jquery-plugin-validation/進行驗證。 – mkas

我已經爲您編輯了代碼，您還可以查看小提琴http://jsfiddle.net/v7MJA/。謝謝 – Usman

您最好給我們一些代碼，以便我們可以幫助。

這裏的理論框架的方法：使用success事件jQuery的ajax^[ref]呼叫：

$.ajax({ 
    url: "test.html", 
    context: document.body, 
    success: function(){ 
    $("#myformdiv").html("Thanks!"); 
    } 
});

假設你的HTML標記是一樣的東西：

<div id="myformdiv"> 
    <form> 
    <!-- form code here --> 
    </form> 
</div>

來源

2011-10-05 12:07:00 JMax

如果這是您需要的，您可以使用加載函數加載單獨的頁面。用'load（「success.php」）替換'html（「Thanks！」）;'並且它會將'success.php'作爲獨立頁面加載並插入到該元素中。 – Tom

假設我理解你的如果問題沒有問題，可以使用replaceWith方法替換指定內容中的匹配元素：

$("#yourForm").replaceWith("<p>Thanks!</p>");

我假設你正在做的事情異步表單數據發送到服務器，所以你可以在回調運行上面的代碼：

$.post("yourScript.php", function() { 
    $("#yourForm").replaceWith("<p>Thanks!</p>"); 
});

來源

2011-10-05 12:07:36

通過http://api.jquery.com/replaceWith/ – 2011-10-05 12:09:53

jQuery - 用'謝謝信息'替換聯繫表格

回答

相關問題