问题描述
我很久以前就这样做了,但是现在,我不记得了,我不能把这个工作...
所以,我有一个可以处理另一个file.PHP的表单,用于发送电子邮件,并且我想发出一个甜美的警报来告诉人们,好的,您的消息已经发送了...
<link href="sweet/style.css" type="text/css" rel="stylesheet">
<link href="sweet/sweetalert.css" type="text/css" rel="stylesheet">
<script src="sweet/jquery-3.4.1.min.js" type="text/javascript"></script>
<script src="sweet/sweetalert.min.js" type="text/javascript"></script>
<script type='text/javascript'>
$( document ).ready(function() {
// Show image
$("#but3").click(function(){
var message = $("#message").val();
var title = $("#title").val();
if(message == "Welcome"){
message = "Welcome";
}
if(title == "Welcome"){
title = "Welcome";
}
swal({
title: title,text: message,imageUrl: "logo.png"
});
});
// Timer
$("#but4").click(function(){
var message = $("#message").val();
var title = $("#title").val();
if(message == ""){
message = "Your message";
}
if(title == ""){
title = "Your message";
}
message += "(close after 2 seconds)";
swal({
title: title,timer: 2000,showConfirmButton: false
});
});
});
</script>
<!-- main-container -->
<div class="container main-container">
<div class="col-md-6">
<form action="envia.PHP" name="envia" id="envia" method="post">
<div class="row">
<div class="col-md-6">
<div class="input-contact">
<input type="text" name="nome" id="nome" required>
<span>Nome</span>
</div>
</div>
<div class="col-md-6">
<div class="input-contact">
<input type="text" id="email" name="email" required>
<span>Email</span>
</div>
</div>
<div class="col-md-12">
<div class="input-contact">
<input type="text" name="assunto" id="assunto" required>
<span>Assunto</span>
</div>
</div>
<div class="col-md-12">
<div class="textarea-contact">
<textarea name="menssagem" id="mensagem" required></textarea>
<span>Mensagem</span>
</div>
</div>
<div class="col-md-12">
<input type="submit" name="enviar" value="enviar" class="btn btn-Box">
</div>
</div>
</form>
<table>
<tr><td> THIS SMALL FORM ITS JUST FOR SHOW SWEET ALERT </TD></TR>
<tr>
<td>Title</td>
<td><input type='text' value='Title text' id='title'></td>
</tr>
<tr>
<td>Message</td>
<td><input type='text' value='Your message' id='message'></td>
</tr>
<tr>
<td colspan='2'>
<input type='button' value='Alert with image' id='but4'>
</td>
</tr>
</table>
</div>
-
<!-- main-container -->
<div class="container main-container">
<div class="col-md-6">
<form action="envia.PHP" name="envia" id="envia" method="post">
<div class="row">
<div class="col-md-6">
<div class="input-contact">
<input type="text" name="nome" id="nome" required>
<span>Nome</span>
</div>
</div>
<div class="col-md-6">
<div class="input-contact">
<input type="text" id="email" name="email" required>
<span>Email</span>
</div>
</div>
<div class="col-md-12">
<div class="input-contact">
<input type="text" name="assunto" id="assunto" required>
<span>Assunto</span>
</div>
</div>
<div class="col-md-12">
<div class="textarea-contact">
<textarea name="menssagem" id="mensagem" required></textarea>
<span>Mensagem</span>
</div>
</div>
<div class="col-md-12">
<input type="submit" name="enviar" value="enviar" class="btn btn-Box">
</div>
</div>
</form>
<table>
<tr><td> THIS SMALL FORM ITS JUST FOR SHOW SWEET ALERT </TD></TR>
<tr>
<td>Title</td>
<td><input type='text' value='Title text' id='title'></td>
</tr>
<tr>
<td>Message</td>
<td><input type='text' value='Your message' id='message'></td>
</tr>
<tr>
<td colspan='2'>
<input type='button' value='Alert with image' id='but4'>
</td>
</tr>
</table>
</div>
$nomeremetente = $_POST['nome'];
$emailremetente = trim($_POST['email']);
$emaildestinatario = 'info@mydomain.pt';// Digite seu e-mail aqui,lembrando que o e-mail deve estar em seu servidor web
$assunto = $_POST['assunto'];
$mensagem = $_POST['mensagem'];
/* Montando a mensagem a ser enviada no corpo do e-mail. */
$mensagemHTML = '
<strong>Formulário de Contato</strong>
<p><b>Nome:</b> '.$nomeremetente.' <p>
<b>E-Mail:</b> '.$emailremetente.' <p>
<b>Assunto:</b> '.$assunto.' <p>
<b>Mensagem:</b> '.$mensagem.'</p>
<hr>';
// O remetente deve ser um e-mail do seu domínio conforme determina a RFC 822.
// O return-path deve ser ser o mesmo e-mail do remetente.
$headers = "MIME-Version: 1.1\r\n";
$headers .= "Content-type: text/html; charset=utf-8\r\n";
$headers .= "From: $emailremetente\r\n";
// remetente
$headers .= "Return-Path: $emaildestinatario \r\n";
// return-path
$envio = mail($emaildestinatario,$assunto,$mensagemHTML,$headers);
if($envio)
echo "<script>location.href='contact.PHP'</script>";// Página que será redirecionada
我已经尝试了很多方法,但我只是重置了所有内容,现在我不知道该怎么办.........
解决方法
已编辑为完整的代码修复程序
contact.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Box personal portfolio Template</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" />
<link href="ionicons/css/ionicons.min.css" rel="stylesheet" />
<link rel="icon" href="img/fav.png" type="image/x-icon" />
<!-- main css -->
<link href="css/style.css" rel="stylesheet" />
<!-- Sweetalert -->
<!-- <link href="sweet/style.css" type="text/css" rel="stylesheet" /> -->
<link href="sweet/sweetalert.css" type="text/css" rel="stylesheet" />
<script src="sweet/sweetalert.min.js" type="text/javascript"></script>
<!-- modernizr -->
<script src="js/modernizr.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Preloader -->
<div id="preloader">
<div class="pre-container">
<div class="spinner">
<div class="double-bounce1"></div>
<div class="double-bounce2"></div>
</div>
</div>
</div>
<!-- end Preloader -->
<div class="container-fluid">
<!-- box-header -->
<header class="box-header">
<div class="box-logo">
<a href="index.html"
><img src="img/logo.png" width="80" alt="Logo"
/></a>
</div>
<!-- box-nav -->
<a class="box-primary-nav-trigger" href="#0">
<span class="box-menu-text">Menu</span
><span class="box-menu-icon"></span>
</a>
<!-- box-primary-nav-trigger -->
</header>
<!-- end box-header -->
<!-- nav -->
<nav>
<ul class="box-primary-nav">
<li class="box-label">About me</li>
<li><a href="index.html">Intro</a></li>
<li><a href="about.html">About me</a></li>
<li><a href="services.html">services</a></li>
<li><a href="portfolio.html">portfolio</a></li>
<li>
<a href="contact.html">contact me</a>
<i class="ion-ios-circle-filled color"></i>
</li>
<li class="box-label">Follow me</li>
<li class="box-social">
<a href="#0"><i class="ion-social-facebook"></i></a>
</li>
<li class="box-social">
<a href="#0"><i class="ion-social-instagram-outline"></i></a>
</li>
<li class="box-social">
<a href="#0"><i class="ion-social-twitter"></i></a>
</li>
<li class="box-social">
<a href="#0"><i class="ion-social-dribbble"></i></a>
</li>
</ul>
</nav>
<!-- end nav -->
</div>
<!-- top bar -->
<div class="top-bar">
<h1>contact Me</h1>
<p><a href="#">Home</a> / Contact Me</p>
</div>
<!-- end top bar -->
<!-- main-container -->
<div class="container main-container">
<div class="col-md-6">
<form name="envia" action="#" id="envia">
<div class="row">
<div class="col-md-6">
<div class="input-contact">
<input type="text" name="nome" id="nome" required />
<span>Nome</span>
</div>
</div>
<div class="col-md-6">
<div class="input-contact">
<input type="text" id="email" name="email" required />
<span>Email</span>
</div>
</div>
<div class="col-md-12">
<div class="input-contact">
<input type="text" name="assunto" id="assunto" required />
<span>Assunto</span>
</div>
</div>
<div class="col-md-12">
<div class="textarea-contact">
<textarea name="menssagem" id="mensagem" required></textarea>
<span>Mensagem</span>
</div>
</div>
<div class="col-md-12">
<input
id="submit"
type="submit"
name="enviar"
value="enviar"
class="btn btn-box"
/>
</div>
</div>
</form>
</div>
<div class="col-md-6">
<h3 class="text-uppercase">Entre em contacto</h3>
<h5>Pedidos orçamento e esclarecimento de dúvidas.</h5>
<div class="h-30"></div>
<p>
<br />Poderá usar este formulário para esclarecimento de dúvidas ou
pedido de orçamento,para pedidos de orçamento deverá indicar o mais
claro possivel o que pretende.
</p>
<div class="contact-info">
<p><i class="ion-android-call"></i>911729199</p>
<p><i class="ion-ios-email"></i>info@obruno.pt</p>
</div>
</div>
</div>
<!-- end main-container -->
<!-- footer -->
<footer>
<div class="container-fluid">
<p class="copyright">© Box Portfolio 2016</p>
</div>
</footer>
<!-- end footer -->
<!-- back to top -->
<a href="#0" class="cd-top"><i class="ion-android-arrow-up"></i></a>
<!-- end back to top -->
<!-- jQuery -->
<script src="js/jquery-2.1.1.js"></script>
<!-- plugins -->
<script src="js/bootstrap.min.js"></script>
<script src="js/menu.js"></script>
<script src="js/animated-headline.js"></script>
<script src="js/isotope.pkgd.min.js"></script>
<!-- custom script -->
<script src="js/custom.js"></script>
<script>
// This will prevent the default button action and the page won't refresh
document.querySelector("#submit").addEventListener(
"click",function (event) {
process();
},false
);
// This will make a post request to your php file
function process() {
// Getting the inputs
var message = document.getElementById("mensagem").value;
var email = document.getElementById("email").value;
var subject = document.getElementById("assunto").value;
var name = document.getElementById("nome").value;
// Some data validation to see if the user have filled the required fields
if (message && email && subject && name) {
event.preventDefault();
// Setting the AJAX request handler
var xmlhttp = new XMLHttpRequest();
// Waiting for a response
xmlhttp.onreadystatechange = function () {
// If the response is 200 aka "OK"
if (this.readyState == 4 && this.status == 200) {
// Show your success alert here
swal({
title: "Message Sent!",text: "Thank you for contacting us.",timer: 2000,showConfirmButton: false,});
document.getElementById("envia").reset();
return;
}
};
// Setting the request type and data to be sent
xmlhttp.open("POST","envia.php",true);
xmlhttp.setRequestHeader(
"Content-type","application/x-www-form-urlencoded"
);
xmlhttp.send(
"nome=" +
name +
"&email=" +
email +
"&assunto=" +
subject +
"&mensagem=" +
message
);
} else {
// Alert the user to fill the required fields
console.log("please fill all required fields");
return;
}
}
</script>
</body>
</html>
envia.php
<?php
$nomeremetente = $_POST['nome'];
$emailremetente = $_POST['email'];
$emaildestinatario = 'info@mydomain.pt';
$assunto = $_POST['assunto'];
$mensagem = $_POST['mensagem'];
$content = '<strong>Formulário de Contato</strong><p><b>Nome:</b> ' . $nomeremetente . ' <p><b>E-Mail:</b> ' . $emailremetente . ' <p><b>Assunto:</b> ' . $assunto . ' <p><b>Mensagem:</b> ' . $mensagem . '</p><hr>';
$headers = array(
'From' => $emailremetente,'Reply-To' => $emaildestinatario,'MIME-Version' => '1.1','Content-type' => 'text/html;charset=UTF-8','X-Mailer' => 'PHP/' . phpversion()
);
if (isset($nomeremetente) && isset($emailremetente) && isset($emaildestinatario) && isset($assunto) && isset($mensagem) && isset($content)) {
mail($emaildestinatario,$assunto,$content,$headers);
echo "SUCCESS";
http_response_code(200);
} else {
echo "FAILED";
http_response_code(404);
}
请注意,我已经添加了一个甜美的警报,您可以继续操作,并自定义消息以在电子邮件成功后显示
注意:不要忘记将要接收电子邮件的电子邮件更改为域中的一封电子邮件,否则这些电子邮件最终将不会被发送或发送到您的垃圾邮件中。