在WordPress中使用jQuery和ajax发送电子邮件可以通过以下步骤实现:
function load_jquery() {
wp_enqueue_script('jquery');
}
add_action('wp_enqueue_scripts', 'load_jquery');
function send_email() {
// 获取表单中的数据
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
// 设置收件人和邮件主题
$to = 'recipient@example.com';
$subject = 'New Email from WordPress';
// 构建邮件内容
$body = "Name: $name\n\n";
$body .= "Email: $email\n\n";
$body .= "Message: $message\n\n";
// 发送邮件
$result = wp_mail($to, $subject, $body);
// 返回结果给前端
if ($result) {
echo 'success';
} else {
echo 'error';
}
// 终止脚本执行
wp_die();
}
add_action('wp_ajax_send_email', 'send_email');
add_action('wp_ajax_nopriv_send_email', 'send_email');
jQuery(document).ready(function($) {
$('#contact-form').submit(function(e) {
e.preventDefault();
// 获取表单数据
var name = $('#name').val();
var email = $('#email').val();
var message = $('#message').val();
// 发送ajax请求
$.ajax({
url: ajaxurl,
type: 'POST',
data: {
action: 'send_email',
name: name,
email: email,
message: message
},
success: function(response) {
if (response === 'success') {
// 邮件发送成功的处理逻辑
alert('Email sent successfully!');
} else {
// 邮件发送失败的处理逻辑
alert('Failed to send email!');
}
},
error: function() {
// ajax请求失败的处理逻辑
alert('An error occurred while sending the email!');
}
});
});
});
<form id="contact-form">
<input type="text" id="name" name="name" placeholder="Your Name">
<input type="email" id="email" name="email" placeholder="Your Email">
<textarea id="message" name="message" placeholder="Your Message"></textarea>
<button type="submit">Send Email</button>
</form>
以上代码将在WordPress中使用jQuery和ajax发送电子邮件。当用户填写表单并点击发送按钮时,将通过ajax请求将表单数据发送到服务器端,并使用wp_mail函数发送电子邮件。根据发送结果,前端页面将显示相应的成功或失败提示。
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云