带有单选按钮的 PHP 邮件表单使用 AJAX 发送
Posted
技术标签:
【中文标题】带有单选按钮的 PHP 邮件表单使用 AJAX 发送【英文标题】:PHP mailer form with radio buttons using AJAX to send 【发布时间】:2012-09-14 22:51:19 【问题描述】:TL; DR 解决方案: 将 javascript 中的 .val 更改为 .serialize 以用于任何无线电输入。
我一直在使用this tutorial 构建一个表单,当提交按钮被按下时,按钮淡出并淡出“谢谢”消息并在后台发送mailer.php。我的表单有单选按钮,我似乎无法弄清楚如何让 javascript 将选择的按钮发送到我的电子邮件。
这是html表单:
<form action="" method="" name="rsvp" id="rsvp-form">
<fieldset>
<legend>RSVP</legend>
<ol>
<li>
<input id="accepts1" class="rsvps" name="rsvps" type="radio" value="Graciously_Accepts" />
<label for="accepts1">Graciously Accepts</label>
</li>
<li>
<input id="declines1" class="rsvps" name="rsvps" type="radio" value="Regretfully_Declines" />
<label for="declines1">Regretfully Declines</label>
</li>
<li>
<input id="accepts2" class="rsvps" name="rsvps" type="radio" value="Regretfully_Accepts" />
<label for="accepts2">Regretfully Accepts</label>
</li>
<li>
<input id="declines2" class="rsvps" name="rsvps" type="radio" value="Graciously_Declines" />
<label for="declines2">Graciously Declines</label>
</li>
</ol>
</fieldset>
<div id="rsvp-wrapper">
<fieldset>
<button class="button" type="submit" value="send">RSVP!</button>
</fieldset>
</form>
<div class="success"></div>
</div>
javascript:
<script type="text/javascript">
$(function()
$(".button").click(function()
var rsvps = $(".rsvps").val();
var dataString = 'rsvps=' + rsvps;
$.ajax(
type: "POST",
url: "rsvp-mailer.php",
data: dataString,
success: function()
$('#rsvp-wrapper').html("<div class='success'></div>");
$('.success').html("<p class='italic'>Thanks!</p>")
.hide()
.fadeIn(500, function()
$('.success');
);
);
return false;
);
);
</script>
还有mailer.php:
<?php
$rsvps = $_POST['rsvps'];
$formcontent="
RSVP: $rsvps \n";
$recipient = "myemail@domain.com";
$subject = "RSVP";
$mailheader = "RSVP \r\n";
mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
?>
非常感谢您提供的任何见解。
【问题讨论】:
【参考方案1】:将var rsvps = $(".rsvps").val();
更改为var rsvps = $(".rsvps[selected=selected]").val();
另外,dataString 必须是像 var dataString = rsvps : rsvps ;
这样的 json 对象,才能通过 ajax POST 访问。
【讨论】:
【参考方案2】:您不需要 javascript 来获取值以便将它们发送到电子邮件。改用 PHP。
$formcontent .= $_POST['rsvp'];
该行将在 $recipient 发送单选按钮的值之前添加。
【讨论】:
【参考方案3】:试试这个。请参阅jQuery.post() 了解更多信息。
<script type="text/javascript">
$('form').submit(function()
var data = $(this).serialize();
$.post("rsvp-mailer.php", data, function()
$('#rsvp-wrapper').html("<div class='success'></div>");
$('.success').html("<p class='italic'>Thanks!</p>")
.hide()
.fadeIn(500, function()
$('.success');
);
return false;
</script>
【讨论】:
是的!这是按顺序发送所有表单的最佳方式,然后您可以在其他页面上调用任何元素名称..并根据需要显示结果..希望这对您有好处. 这是返回正确的数据,但在页面的 url 中,而不是电子邮件。例如:domain.com/?rsvps=Regretfully_Declines 原来只是将 .val 更改为 .serialize 有效。唯一的小问题是电子邮件中写着RSVP: rsvps=Regretfully_Declines
感谢您的帮助!【参考方案4】:
不要通过类选择器访问单选按钮,请尝试以下操作:
var rsvps = $('input[name=rsvps]:radio').val();
【讨论】:
当我这样做时,它只会向我发送第一个单选按钮作为响应,即使已选择了另一个单选按钮。 实际上采用您的 sn-p 并将 .val 更改为 .serialize 工作。唯一的小问题是电子邮件中写着RSVP: rsvps=Regretfully_Declines
感谢您的帮助!以上是关于带有单选按钮的 PHP 邮件表单使用 AJAX 发送的主要内容,如果未能解决你的问题,请参考以下文章