使用PHP通過電子郵件發送表單內容而不加載新頁面？

Question

我正在創建一個向我發送電子郵件但不加載新頁面的表單，而是僅修改了同一頁面上的一些HTML和CSS值。

我已經嘗試實現它，並且它接近完成，只是無法正常工作。 單擊提交后，它不會驗證表單，它會加載PHP頁面並顯示“謝謝...”，然后我會收到一封電子郵件。 如果您能幫助我理解和調試它，我將不勝感激。 謝謝！

我可以確認jQuery已正確鏈接。 我按以下順序進行安裝：

<html>
<head>
 <script> (link for jquery)
 <style>
 <script>
   validateForm() JavaScript
   jQuery
<body> (no loading functions via onload)

HTML形式：

<form  id='form' method='post' action='sendemail.php'>
                    Name: <br />
                    <input type="text" id="name" name="name" />
                    <br /><br />
                    Email: <br />
                    <input type="email" id="email" name="email" />
                    <br /><br />
                    Subject: <br />
                    <input type="text" id="subject" name="subject" />
                    <br /><br />

                    Comments: <br />
                    <textarea id="comments" name="comments" rows="10" cols="60"></textarea>
                    <br /><br />

                    <input type="image" src="..." name="myFormSubmitted" value="Submit" />        
                </form>
                <div id="formResponse"></div>

PHP-sendmail.php：

<?php
if(isset($_POST['myFormSubmitted'])) {
    $message = '';

    // Construct the message
    $message .= <<<TEXT
        Name: {$_POST['name']}
        Email: {$_POST['email']}
    Subject: {$_POST['subject']}
    Comments: {$_POST['comments']}  
        {$checkString}
TEXT;

    $to = 'sendMeHere@example.com';
    $subject = $_POST['subject'];
    $from = $_POST['name'];
    $fromEmail = $_POST['email'];

    $header = 'From: ' . $from . '<' . $fromEmail . '>';

    // Send the email
    mail($to, $subject, $message, $header);

    echo 'Thank you for your Email. We will get in touch with you very soon.';
}
?>

jQuery的：

//On form submit, call validateForm, then post to PHP if validated
            $("#form").submit(function(e) {
                if (validateForm()) {
                    $.post( 
                        'sendemail.php', 
                        {
                            name: $('#name').val(), 
                            email: $('#email').val(), 
                            comments: $('#comments').val(), 
                            myFormSubmitted: 'yes'
                        }, 
                        function(data) {
                            $("#formResponse").html(data).fadeIn('100'); //Place echo in div
                            //Modify HTML & CSS here
                            $('#name, #email, #comments').val(''); //Clear the inputs - I don't understand this line
                        }, 
                        'text'
                    );
                }

                //Prevent event from bubbling
                e.preventDefault();
                e.stopPropagation();

                return false;
            });

JavaScript驗證功能：

            $(document).ready(function() {
            function validateForm() {
                var validName = false;
                var validEmail = false;
                var validSubject = false;
                var validComments = false;

                //Perform validation here...

if (validName && validEmail && validSubject && validComments) {
return true;
} else {
return false;
}
});

Answer 1

您應該將JavaScript包裝在就緒的事件處理程序中，如下所示：

$(document).ready(function() {
    // Your javascript here...
});

Answer 2

刪除HTML表單標簽上的“ action ='sendemail.php'”屬性。

Answer 3

只是一個替代解決方案。 您可以在input [type = image]的click事件中提交觸發表單提交的內容。 我沒有檢查過，但希望可以！

$('input[type=image]').click(function(e){
           e.preventDefault();
           $('#form').submit();
 });

使用PHP通過電子郵件發送表單內容而不加載新頁面？

問題描述

3 個解決方案

解決方案1
0 2012-12-06 21:28:14

解決方案2
0 2012-12-06 23:14:32

解決方案3
0 2013-07-22 16:39:17

使用PHP通過電子郵件發送表單內容而不加載新頁面？

問題描述

3 個解決方案

解決方案1 0 2012-12-06 21:28:14

解決方案2 0 2012-12-06 23:14:32

解決方案3 0 2013-07-22 16:39:17

解決方案1
0 2012-12-06 21:28:14

解決方案2
0 2012-12-06 23:14:32

解決方案3
0 2013-07-22 16:39:17