Javascript 使用PHP提交表单
请原谅我的无知，但我对PHP完全陌生。我下载了一个网站模板，它有一个表单，当有人点击提交按钮时，我想发送到我的电子邮件地址。我该怎么做？现有代码复制如下：Javascript 使用PHP提交表单,javascript,php,jquery,ajax,forms,Javascript,Php,Jquery,Ajax,Forms,请原谅我的无知，但我对PHP完全陌生。我下载了一个网站模板，它有一个表单，当有人点击提交按钮时，我想发送到我的电子邮件地址。我该怎么做？现有代码复制如下： function rsvpFormSubmit() { // this is the id of the form var formID = $("#js-form"); // submits form with ajax method formID.on("submit", function() {
function rsvpFormSubmit() {
// this is the id of the form
var formID = $("#js-form");
// submits form with ajax method
formID.on("submit", function() {
$.ajax({
url: "mailer.php",
type: "POST",
data: formID.serialize(), // serializes the form's elements.
success: function(data) {
$(".js-display")
.addClass("message-panel")
.html(data); // show response from the php script.
}
});
return true; // avoid to execute the actual submit of the form.
});
// Show/Hide RSVP Menu selection on accept/decline
$(".decline").on("click", function(){
$(".rsvp-meal-choice").fadeOut();
});
$(".accept").on("click", function(){
$(".rsvp-meal-choice").fadeIn();
});
}
rsvpFormSubmit();
<div id="section-6" class="js-form">
<div class="section-title-container">
<h2 class="section-title">Rsvp</h2>
<span class="hearts"></span>
</div>
<div class="small-12 large-10 large-centered columns">
<form data-abide method="POST" action="#" class="rsvp-form custom" id="js-form">
<fieldset class="rsvp-details">
<!-- Displays a global alert if required fields are missing -->
<div class="js-display"></div>
<legend>
Kindly respond by <strong>March 14, 2014</strong>. We look forward to celebrating with you!
</legend>
<div class="row">
<div class="large-6 columns">
<label for="firstname">First Name</label>
<input type="text" class="input-field" id="firstname" name="firstname" value="" placeholder="Your first name is required" required>
<small class="error">First Name is required.</small>
</div>
<div class="large-6 columns">
<label for="lastname">Last Name</label>
<input type="text" class="input-field" id="lastname" name="lastname" value="" placeholder="Your last name is required" required>
<small class="error">Last Name is required.</small>
</div>
</div>
<div class="row">
<div class="large-6 columns">
<label for="email">Email</label>
<input type="email" class="input-field" id="email" name="email" value="" placeholder="name@yourdomain.com" required>
<small class="error">Valid Email is required.</small>
</div>
<div class="large-6 columns">
<label for="phone">Phone</label>
<input type="tel" class="input-field" id="phone" name="phone" value="" placeholder="A phone number is optional">
</div>
</div>
</fieldset>
<fieldset class="rsvp-attendance">
<legend>Will you be attending?</legend>
<div class="large-6 columns">
<label for="radio1">
<input name="radio" type="radio" id="radio1" style="display:none;" value="Accepts with Pleasure!" required>
<span class="custom radio accept"></span>
<span class="radio-label">Accepts with Pleasure!</span>
</label>
</div>
<div class="large-6 columns">
<label for="radio2">
<input name="radio" type="radio" id="radio2" style="display:none;" value="Declines with Regret." required>
<span class="custom radio decline"></span>
<span class="radio-label">Declines with Regret.</span>
</label>
</div>
</fieldset>
<fieldset class="rsvp-meal-choice">
<legend>
Please select your meal choices
</legend>
<div class="row">
<div class="large-6 columns">
<label for="main-course">Main</label>
<select id="main-course" name="main-course">
<option selected>None</option>
<option>Chicken</option>
<option>Beef</option>
<option>Vegetarian</option>
</select>
</div>
<div class="large-6 columns">
<label for="dessert">Dessert</label>
<select id="dessert" name="dessert">
<option selected>None</option>
<option>Chocolate Cake</option>
<option>Lemon Cheesecake</option>
<option>Key Lime Pie</option>
</select>
</div>
</div>
</fieldset>
<button type="submit" class="button radius" id="js-submit-btn">
<i class="fa fa-envelope"></i>
<span class="btn-label">Send</span>
</button>
</form>
调用此函数和mailer.PHP中添加的所有PHP代码创建mailer.PHP函数后，请将这些代码编码到其中
<?php
if(isset($_POST['submit'])){
$to = "email@example.com"; // this is your Email address
$from = $_POST['email']; // this is the sender's Email address
$first_name = $_POST['first_name'];
$last_name = $_POST['last_name'];
$subject = "Form submission";
$subject2 = "Copy of your form submission";
$message = $first_name . " " . $last_name . " wrote the following:" . "\n\n" . $_POST['message'];
$message2 = "Here is a copy of your message " . $first_name . "\n\n" . $_POST['message'];
$headers = "From:" . $from;
$headers2 = "From:" . $to;
mail($to,$subject,$message,$headers);
mail($from,$subject2,$message2,$headers2); // sends a copy of the message to the sender
echo "Mail has been Sent. Thank you " . $first_name . ", we will contact you shortly.";
}
?>
谢谢你你所拥有的只是邮件的一部分。您还必须拥有mailer.php文件，以防您还不知道，并且需要一个名为js form的表单，该表单包含mailer.php文件中匹配的输入名称。该文件将是发送电子邮件的文件。您使用的是本地主机还是托管服务器？嗯，我似乎没有mailer.php文件。这就是问题所在吗？只需创建php文件mailer.phpCreated！我应该在里面放什么呢？顺便说一下，如果有帮助的话，我在上面添加了表单HTML代码。如果您需要其他代码，请告诉我。绑定到事件处理程序比使用onsubmit或onclick更好。您好，谢谢您的代码！我将它粘贴到Mailer.php文件中，但它仍然不起作用。我应该做些什么来测试它并查看它失败的地方？在javascript中也请添加这一行..以便我可以尝试找出实际问题原始行数据：formID.serialize，//序列化表单的元素。替换为数据：formID.serialize+'&'+$.param{'submit'：1}，//序列化表单的元素。希望它能帮助我们解决这个问题
<?php
if(isset($_POST['submit'])){
$to = "email@example.com"; // this is your Email address
$from = $_POST['email']; // this is the sender's Email address
$first_name = $_POST['first_name'];
$last_name = $_POST['last_name'];
$subject = "Form submission";
$subject2 = "Copy of your form submission";
$message = $first_name . " " . $last_name . " wrote the following:" . "\n\n" . $_POST['message'];
$message2 = "Here is a copy of your message " . $first_name . "\n\n" . $_POST['message'];
$headers = "From:" . $from;
$headers2 = "From:" . $to;
mail($to,$subject,$message,$headers);
mail($from,$subject2,$message2,$headers2); // sends a copy of the message to the sender
echo "Mail has been Sent. Thank you " . $first_name . ", we will contact you shortly.";
}
?>