如何使用PHP将html表单输入字段发送到电子邮件

时间:2016-06-12 15:58:32

标签: javascript php

我需要帮助通过PHP代码将表单输入信息发送到我的电子邮件。我已经包含了我的PHP代码,但输入字段没有被发送到电子邮件。请告知。

    <form method="Post" id="form1" action="form-to-email.php" >
















    <legend>Time:11:30</legend>



    <fieldset id="fullname">




    <label for="name">Name</label>
    <input type="text" name="name" id="name" size="20" maxlength="50" />
    </fieldset>



    <fieldset id="NumberofAdults">

    <label for="Adults"># Adults</label>
    <input type="text" name="#ofadults" id="Adults" size="5" maxlength="2" />

    </fieldset>



    <fieldset id="Numberofkids">

    <label for="kids"># Kids</label>
    <input type="text" name="kids" id="kids" size="5" maxlength="2" />

    </fieldset>

    <fieldset id="infants">

        <label for="numberofinfants">Infants</label>
        <input type="text" name="numberofinfants" id="numberofinfants" size="5" maxlength="2"/>


    </fieldset>




        <fieldset id="tablenumber">

        <label for="table">Table #</label>
        <input type="text" name="table" id="table" size="5" maxlength="2"/>




        </fieldset>



        <fieldset id="Checknumber">

        <label for="check">Check #</label>
        <input type="text" name="check" id="check" size="5" maxlength="5"/>


        </fieldset>



        <fieldset id="M">

        <label for="misc">Misc.</label>
        <input type="text" name="Misc" id="Misc" size="75" maxlength="100"/>


        </fieldset>
        <fieldset id="email">

    <label for="Email">Email</label>
    <input type="text" name="Email" id="Email" size="5" maxlength="45" />

    </fieldset>


    <fieldset id="Total">
        <label for="adulttotal">Total Adults</label>
        <input type="text" id="adulttotal" value="0" name="adulttotal" readonly/>
        <br/>
        <label for="kidstotal">Total Kids</label>
        <input type="text" id="kidstotal" value="0" name="kidstotal" readonly/>
        <br/>
        <label for="infanttotal">Total Infants</label>
        <input type="text" id="infanttotal" value="0" name="infantstotal" readonly />
        </fieldset>





    <legend>Time:12:00</legend>



    <fieldset id="fullname">




    <label for="Name">Name</label>
    <input type="text" name="name" id="name" size="20" maxlength="50" />
    </fieldset>



    <fieldset id="NumberofAdults">

    <label for="#ofadults"># Adults</label>
    <input type="text" name="#ofadults" id="Adults" size="5" maxlength="2" />

    </fieldset>



    <fieldset id="Numberofkids">

    <label for="kids"># Kids</label>
    <input type="text" name="kids" id="kids" size="5" maxlength="2" />

    </fieldset>


    <fieldset id="infants">

        <label for="numberofinfants">Infants</label>
        <input type="text" name="numberofinfants" id="numberofinfants" size="5" maxlength="2"/>


    </fieldset>




        <fieldset id="tablenumber">

        <label for="table">Table #</label>
        <input type="text" name="table" id="table" size="5" maxlength="2"/>




        </fieldset>



        <fieldset id="Checknumber">

        <label for="check">Check #</label>
        <input type="text" name="check" id="check" size="5" maxlength="5"/>


        </fieldset>



        <fieldset id="M">

        <label for="misc">Misc.</label>
        <input type="text" name="Misc" id="Misc" size="75" maxlength="100"/>


        </fieldset>

        <fieldset id="email">

    <label for="Email">Email</label>
    <input type="text" name="Email" id="Email" size="5" maxlength="45" />

    </fieldset>


    <fieldset id="Total">
        <label for="adulttotal">Total Adults</label>
        <input type="text" id="adulttotal" value="0" name="adulttotal" readonly/>
        <br/>
        <label for="kidstotal">Total Kids</label>
        <input type="text" id="kidstotal" value="0" name="kidstotal" readonly/>
        <br/>
        <label for="infanttotal">Total Infants</label>
        <input type="text" id="infanttotal" value="0" name="infantstotal" readonly />
        </fieldset>



    <legend>Time:12:30</legend>



    <fieldset id="fullname">




    <label for="Name">Name</label>
    <input type="text" name="name" id="name" size="20" maxlength="50" />
    </fieldset>



    <fieldset id="NumberofAdults">

    <label for="#ofadults"># Adults</label>
    <input type="text" name="#ofadults" id="Adults" size="5" maxlength="2" />

    </fieldset>



    <fieldset id="Numberofkids">

    <label for="kids"># Kids</label>
    <input type="text" name="kids" id="kids" size="5" maxlength="2" />

    </fieldset>


    <fieldset id="infants">

        <label for="numberofinfants">Infants</label>
        <input type="text" name="numberofinfants" id="numberofinfants" size="5" maxlength="2"/>


    </fieldset>




        <fieldset id="tablenumber">

        <label for="table">Table #</label>
        <input type="text" name="table" id="table" size="5" maxlength="2"/>




        </fieldset>



        <fieldset id="Checknumber">

        <label for="check">Check #</label>
        <input type="text" name="check" id="check" size="5" maxlength="5"/>


        </fieldset>



        <fieldset id="M">

        <label for="misc">Misc.</label>
        <input type="text" name="Misc" id="Misc" size="75" maxlength="100"/>


        </fieldset>

    <fieldset id="email">

    <label for="Email">Email</label>
    <input type="text" name="Email" id="Email" size="5" maxlength="45" />

    </fieldset>


    <fieldset id="Total">
        <label for="adulttotal">Total Adults</label>
        <input type="text" id="adulttotal" value="0" name="adulttotal" readonly/>
        <br/>
        <label for="kidstotal">Total Kids</label>
        <input type="text" id="kidstotal" value="0" name="kidstotal" readonly/>
        <br/>
        <label for="infanttotal">Total Infants</label>
        <input type="text" id="infanttotal" value="0" name="infantstotal" readonly />
        </fieldset>







    <legend>Time:1:00</legend>



    <fieldset id="fullname">




    <label for="Name">Name</label>
    <input type="text" name="name" id="name" size="20" maxlength="50" />
    </fieldset>



    <fieldset id="NumberofAdults">

    <label for="#ofadults"># Adults</label>
    <input type="text" name="#ofadults" id="Adults" size="5" maxlength="2" />

    </fieldset>



    <fieldset id="Numberofkids">

    <label for="kids"># Kids</label>
    <input type="text" name="kids" id="kids" size="5" maxlength="2" />

    </fieldset>


    <fieldset id="infants">

        <label for="numberofinfants">Infants</label>
        <input type="text" name="numberofinfants" id="numberofinfants" size="5" maxlength="2"/>


    </fieldset>




        <fieldset id="tablenumber">

        <label for="table">Table #</label>
        <input type="text" name="table" id="table" size="5" maxlength="2"/>




        </fieldset>



        <fieldset id="Checknumber">

        <label for="check">Check #</label>
        <input type="text" name="check" id="check" size="5" maxlength="5"/>


        </fieldset>



        <fieldset id="M">

        <label for="Misc">Misc.</label>
        <input type="text" name="Misc" id="Misc" size="75" maxlength="100"/>


        </fieldset>

        <fieldset id="email">

    <label for="Email">Email</label>
    <input type="text" name="Email" id="Email" size="5" maxlength="45" />

    </fieldset>


    <fieldset id="Total">
        <label for="adulttotal">Total Adults</label>
        <input type="text" id="adulttotal" value="0" name="adulttotal" readonly/>
        <br/>
        <label for="kidstotal">Total Kids</label>
        <input type="text" id="kidstotal" value="0" name="kidstotal" readonly/>
        <br/>
        <label for="infanttotal">Total Infants</label>
        <input type="text" id="infanttotal" value="0" name="infantstotal" readonly />
        </fieldset>










    <legend>Time:1:30</legend>



    <fieldset id="fullname">




    <label for="Name">Name</label>
    <input type="text" name="name" id="name" size="20" maxlength="50" />
    </fieldset>



    <fieldset id="NumberofAdults">

    <label for="#ofadults"># Adults</label>
    <input type="text" name="#ofadults" id="Adults" size="5" maxlength="2" />

    </fieldset>



    <fieldset id="Numberofkids">

    <label for="kids"># Kids</label>
    <input type="text" name="kids" id="kids" size="5" maxlength="2" />

    </fieldset>


    <fieldset id="infants">

        <label for="numberofinfants">Infants</label>
        <input type="text" name="numberofinfants" id="numberofinfants" size="5" maxlength="2"/>


    </fieldset>




        <fieldset id="tablenumber">

        <label for="table">Table #</label>
        <input type="text" name="table" id="table" size="5" maxlength="2"/>




        </fieldset>



        <fieldset id="Checknumber">

        <label for="check">Check #</label>
        <input type="text" name="check" id="check" size="5" maxlength="5"/>


        </fieldset>



        <fieldset id="M">

        <label for="misc">Misc.</label>
        <input type="text" name="Misc" id="Misc" size="75" maxlength="100"/>


        </fieldset>

        <fieldset id="email">

    <label for="Email">Email</label>
    <input type="text" name="Email" id="Email" size="5" maxlength="45" />

    </fieldset>


    <fieldset id="Total">
        <label for="adulttotal">Total Adults</label>
        <input type="text" id="adulttotal" value="0" name="adulttotal" readonly/>
        <br/>
        <label for="kidstotal">Total Kids</label>
        <input type="text" id="kidstotal" value="0" name="kidstotal" readonly/>
        <br/>
        <label for="infanttotal">Total Infants</label>
        <input type="text" id="infanttotal" value="0" name="infantstotal" readonly />
        </fieldset>






    <legend>Time:2:00</legend>



    <fieldset id="fullname">




    <label for="name">Name</label>
    <input type="text" name="name" id="name" size="20" maxlength="50" />
    </fieldset>



    <fieldset id="NumberofAdults">

    <label for="#ofadults"># Adults</label>
    <input type="text" name="#ofadults" id="Adults" size="5" maxlength="2" />

    </fieldset>



    <fieldset id="Numberofkids">

    <label for="kids"># Kids</label>
    <input type="text" name="kids" id="kids" size="5" maxlength="2" />

    </fieldset>


    <fieldset id="infants">

        <label for="numberofinfants">Infants</label>
        <input type="text" name="numberofinfants" id="numberofinfants" size="5" maxlength="2"/>


    </fieldset>




        <fieldset id="tablenumber">

        <label for="table">Table #</label>
        <input type="text" name="table" id="table" size="5" maxlength="2"/>




        </fieldset>



        <fieldset id="Checknumber">

        <label for="check">Check #</label>
        <input type="text" name="check" id="check" size="5" maxlength="5"/>


        </fieldset>



        <fieldset id="M">

        <label for="Misc">Misc.</label>
        <input type="text" name="Misc" id="Misc" size="75" maxlength="100"/>


        </fieldset>

        <fieldset id="email">

    <label for="Email">Email</label>
    <input type="text" name="Email" id="Email" size="5" maxlength="45" />

    </fieldset>


    <fieldset id="Total">
        <label for="adulttotal">Total Adults</label>
        <input type="text" id="adulttotal" value="0" name="adulttotal" readonly/>
        <br/>
        <label for="kidstotal">Total Kids</label>
        <input type="text" id="kidstotal" value="0" name="kidstotal" readonly/>
        <br/>
        <label for="infanttotal">Total Infants</label>
        <input type="text" id="infanttotal" value="0" name="infantstotal" readonly />
        </fieldset>












      <p>


      <input id="Cancel" type="reset" value="Cancel"/>
      <input id="Submit" type="Submit" name="submit1" value="Submit the Form"/>
      </p>

</form>

CSS文件

     /* Footer Styles */
footer {
    border - top: 1px solid red;
    background - color: rgb(255, 191, 165);
    clear: left;
    margin - top: 20px;
    padding: 10px 0px;
}
header {
    float: left;
    width: 100 % ;
    background: url(Bethwoodlogo.jpg) bottom right no - repeat; - o - background - size: contain; - moz - background - size: contain; - webkit - background - size: contain;
    background - size: contain;
    background - color: rgb(255, 191, 165);
    border - bottom: 1px solid red;
}
header img {
    display: block;
    float: left;
    width: 100 % ;
}
footer address {
    color: rgb(233, 69, 0);
    font - style: normal;
    font - size: 0.8em;
    text - align: center;
}
form {
    border: solid rgb(135, 206, 250) 5px;
    width: 100 % ;
    length: 100 % ;
}
label {
    width: 100 % ;
    length: 100 % ;
    Background - color: rgb(135, 206, 250);
    clear: both;
    border: solid #666 1px; float:left; text-align:center; }    # fullname {
        float: left;
        margin: 10x 0px 10px 2.5 % ;
        width: 10 % ;
    }#
    NumberofAdults {
        width: 5 % ;
        float: left;
    }#
    Numberofkids {
        width: 5 % ;
        float: left;
    }#
    infants {
        width: 5 % ;
        float: left;
    }#
    Checknumber {
        float: left;
        width: 5 % ;
    }#
    M {
        float: left;
    }#
    tablenumber {
        width: 5 % ;
        float: left;
    }
    legend {
        background - color: rgb(233, 69, 0);
        color: white;
        padding: 3px 0px;
        text - indent: 5px;
        width: 100 % ;
    }
    input {
        float: left;
        display: block;
    }#
    Cancel {
        p {
            float: left;
        }

Javascript文件

    $('form fieldset').not('#Total').delegate('input', 'focus', foo);


function foo(e) {

    if ($(this).is(':last-child')) {

        e.stopPropagation();



        $('<br/>').insertAfter($(this));
        var cloneLabel = $(this).prev().clone();
        var cloneInput = $(this).clone().val("");

        cloneLabel.insertAfter($(this).next());
        cloneInput.insertAfter($(this).next().next());

        removeEmpty($(this));

        total($(this).parent().nextAll('#Total:first'));
    }

}

function removeEmpty(obj) {
    obj.parent().siblings('fieldset').not('#Total').each(function () {
        if ($(this).children('input').length > 1) {

            var count = 1;
            var removeFirst = 0;
            $(this).children('input').each(function () {

                if ($(this).val().length > 0 && removeFirst == 0) {
                    if ($(this).parent().children('input:first').val().length == 0) {
                        $(this).parent().children('input:first').prev().remove();
                        $(this).parent().children('input:first').next().remove()
                        $(this).parent().children('input:first').remove();
                        removeFirst = 1;
                    }
                }

                if ($(this).val().length == 0 && count != 1) {


                    $(this).prev().prev().remove();
                    $(this).prev().remove();
                    $(this).remove();

                }

                count = 2;

            })
        }
    })

}

function total(obj) {

    var totalAdults = 0,
        totalKids = 0,
        totalInfants = 0;

    obj.prevAll('#NumberofAdults:first').children('input').each(function () {
        if (!isNaN(parseInt($(this).val(), 10))) totalAdults += parseInt($(this).val(), 10)

    });

    obj.prevAll('#Numberofkids:first').children('input').each(function () {
        if (!isNaN(parseInt($(this).val(), 10))) totalKids += parseInt($(this).val(), 10)
    });

    obj.prevAll('#infants:first').children('input').each(function () {

        if (!isNaN(parseInt($(this).val(), 10))) totalInfants += parseInt($(this).val(), 10)
    });

    obj.children('#adulttotal').val(totalAdults);
    obj.children('#kidstotal').val(totalKids);
    obj.children('#infanttotal').val(totalInfants);
}


$('#Cancel').click(function (e) {
    e.preventDefault();
    $('#form1')[0].reset();
    removeEmpty($(this));

});

$('#Submit').click(function (e) {
    e.preventDefault();
    removeEmpty($(this));
    $('#form1').children('#Total').each(function () {
        total($(this));
    });
    $('#form1').submit();
});

PHP文件

  <?php
if(!isset($_POST['submit1']))
{
    //This page should not be accessed directly. Need to submit the form.
    echo "error; you need to submit the form!";
}
$name = $_POST['name'];
$Adults = $_POST['#ofadults'];
$kids = $_POST['kids'];
$numberofinfants = $_POST['numberofinfants'];
$table = $_POST['table'];
$check = $_POST['check'];
$Misc = $_POST['Misc'];
$adulttotal = $_POST['adulttotal'];
$kidstotal= $_POST['kidstotal'];
$infanttotal = $_POST['infantstotal'];
$Email = $_POST['Email'];


if(IsInjected($Email))
{
    echo "Bad email value!";
    exit;
}

$to = 'jac79@njit.edu';
$subject = 'sending html form in message';
$headers = "From: " . strip_tags($_POST['req-email']) . "\r\n";
$headers .= "Reply-To: ". strip_tags($_POST['req-email']) . "\r\n";
$headers .= "CC: test@example.com\r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
$message = '<html><body>';
$message .= '<h1>add form html</h1>'; // add the form html
$message .= '</body></html>';
//done. redirect to thank-you page.
header('Location: thank-you.html');




// Function to validate against any email injection attempts
function IsInjected($str)
{
  $injections = array('(\n+)',
              '(\r+)',
              '(\t+)',
              '(%0A+)',
              '(%0D+)',
              '(%08+)',
              '(%09+)'
              );
  $inject = join('|', $injections);
  $inject = "/$inject/i";
  if(preg_match($inject,$str))
    {
    return true;
  }
  else
    {
    return false;
  }
}

?> 

4 个答案:

答案 0 :(得分:0)

缺少<form>的{​​{1}}发送为method="post"

因此,像GET这样的行将无法从$name = $_POST['name'];中获取任何内容,因为它是空的。

您应该强烈考虑使用http://swiftmailer.org/而不是$_POST之类的内容 - 它会比您在mail()函数中尝试更可靠地处理标头注入。< / SUP>

答案 1 :(得分:0)

使用html css文件开发电子邮件。 之后将外部css转换为内联,因为外部css不适用于外部css。 js脚本不能与电子邮件一起使用,因为gmail或任何邮件服务提供商都会从代码中删除它以保护代码或防止垃圾邮件。 使用以下代码邮寄

&#13;
&#13;
$to = 'test@example.com';
$subject = 'sending html form in message';
$headers = "From: " . strip_tags($_POST['req-email']) . "\r\n";
$headers .= "Reply-To: ". strip_tags($_POST['req-email']) . "\r\n";
$headers .= "CC: test@example.com\r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
$message = '<html><body>';
$message .= '<h1>add form html</h1>'; // add the form html
$message .= '</body></html>';

mail($to, $subject, $message, $headers);
&#13;
&#13;
&#13;

http://quandaflow.com/

答案 2 :(得分:0)

ceejayoz是正确的,而且你在mail()电话中缺少来自field = $ email_from的$。

答案 3 :(得分:0)

这是当前工作联系表格的样本,希望它有所帮助!

首先在您的html中将此添加到您的表单标记

<强> HTML

<form method="POST" id="form1" action="form-to-email.php">
</form>

action允许表单进程,即使javascript已禁用或jQuery未处于活动状态,在POST中指定method从默认GET更改为{{1} }}

<强>的Javascript

POST

<强> PHP

  $(document).ready(function() {
    $('#form1').submit(function(e) {
      $.ajax({
        type: 'POST',
        url: 'form-to-email.php',
        data: $(this).serialize(),
        dataType: "json"
      })
      .done(function(msg) {
        if (msg.success == true) {
          console.log(msg)
        }
        else {
          console.log(msg)
        }
      })
      e.preventDefault();
    });
  });