在php腳本中爲聯繫人表單初始化javascript

-1

您好在那裏工作一個簡單的聯繫表單。在php腳本中爲聯繫人表單初始化javascript

<form action="mail.php" method="POST"> 
    <input type="text" id="name" name="name" placeholder="Name" required><br /> 
    <input type="text" id="email" name="email" placeholder="Mail" required><br /> 
    <textarea name="message" placeholder="Nachricht" required></textarea><br /> 
    <button name="submit" type="submit" id="submit">send</button> 
</form>

使用簡單的JavaScript來改變按鈕一個簡單的PHP郵件

<?php 
$name = $_POST['name']; 
$email = $_POST['email']; 
$message = $_POST['message']; 
$formcontent="Von: $name \n Nachricht: $message" ; 
$recipient = "[email protected]"; 
$subject = "$betreff"; 
$mailheader = "Von: $email \r\n"; 
mail($recipient, $subject, $formcontent, $mailheader) or die("Error!"); 
echo "Thank You!" //need to be removed; 
?>

林以 '發送'

var send = document.getElementById('submit'); 
    if(send) { 
     send.onclick = function() { 
      this.innerHTML = 'sending'; 
     } 
    }

是否有可能後到按鈕的innerHTML改變sent PHP腳本已成功完成？另外我怎樣才能避免重定向到mail.php？

首先它應該顯示send。在點擊sending應該出現，並且當mail.php不是sent應該出現在按鈕。

任何想法或建議嗎？

問候 dennym

編輯：進一步的進展和解決方案error on contact form submit via jquery ajax

來源

2013-04-02 Denny Mueller

是否有可能改變按鈕的innerHTML php的後發腳本是成功？

如果您重新加載相同的模板，您可以使按鈕呈現爲sent。你必須跟蹤表單的狀態，儘管在後端。 YOu可以改變你的表單，通過JavaScript使用Ajax提交。收到成功的回覆後，您可以更改innerHTML。

另外我怎樣才能避免重定向到mail.php？

請勿提交表格。使用JavaScript收集值併發出ajax請求。

來源

2013-04-02 14:57:44 dm03514

更改爲新問題http://stackoverflow.com/questions/15769651/error-on-contact-form-submit-via-jquery-ajax更好的概述 –

您應該使用XHR（AJAX）請求。

而不是像你的例子中編寫普通的JavaScript，你會得到更快的一個JavaScript框架，如jQuery。

像這樣的東西應該做的伎倆：

$('form#formId').submit(function(){ 

    //set submit label to sending 
    $('form#formId #submit').html('sending'); 

    $.post('mail.php', function(){ 
     //set submit label to sent 
     $('form#formId #submit').html('sent'); 
    }); 

    //returning false to prevent native submission of form. 
    return false; 

});

你需要給你的形式的ID屬性，這樣可以有選擇地選擇它。

來源

2013-04-02 15:17:34 briangallagher

在php腳本中爲聯繫人表單初始化javascript

回答

相關問題