我终于想出了如何创建向下滑动的Web表单,但是在哪里以及如何设置我的电子邮件地址。因此,当有人向我发送消息时,我在电子邮件中收到了相同的消息。我想这是一个基本问题,但我找不到答案。
以下是JSFiddle的链接:http://jsfiddle.net/8S82T/101/
<!doctype html>
<html>
<head>
<title>Jquery test</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="main.css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>
<body>
<div class="container">
<div id="button" class="title">
<h6>Contact</h6>
</div>
<div id="dropbox">
<header class="title">
<h6>Whats up?</h6>
</header>
<div class="contact-form">
<form action="lulzy.php" action="post">
<h6><img src="img/person.png" alt="" /> Name</h6>
<input type="text" placeholder="Please enter your full name here" required />
<h6><img src="img/email.png" alt="" /> E-mail</h6>
<input type="email" placeholder="Please enter your e-mail address" required/>
<h6><img src="img/message.png" alt="" /> Message</h6>
<textarea placeholder="Type your message..." required/></textarea>
<input type="submit" value="Submit">
</form>
</div>
</div>
</div>
<script src="dropbox.js"></script>
</body>
</html>
答案 0 :(得分:4)
Here是一个很好的教程
它涉及使用服务器端语言PHP。
此脚本还特别使用了一些验证来确保向您发送内容的人不会向您发送垃圾邮件
您还需要在输入中添加name
属性。它们应为name
,email
和comments
。
<?php
if(isset($_POST['email'])) {
// CHANGE THE TWO LINES BELOW
$email_to = "you@yourdomain.com"; // put your email here
$email_subject = "Website HTML form submissions"; // put the subject here
function died($error) {
// your error code can go here
echo "We are very sorry, but there were error(s) found with the form you submitted. ";
echo "These errors appear below.<br /><br />";
echo $error."<br /><br />";
echo "Please go back and fix these errors.<br /><br />";
die();
}
// validation expected data exists
if(!isset($_POST['name']) ||
!isset($_POST['email']) ||
!isset($_POST['comments'])) {
died('We are sorry, but there appears to be a problem with the form you submitted.');
}
$name = $_POST['name']; // required
$email_from = $_POST['email']; // required
$comments = $_POST['comments']; // required
$error_message = "";
$email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/';
if(!preg_match($email_exp,$email_from)) {
$error_message .= 'The Email Address you entered does not appear to be valid.<br />';
}
$string_exp = "/^[A-Za-z .'-]+$/";
if(!preg_match($string_exp,$name)) {
$error_message .= 'The Name you entered does not appear to be valid.<br />';
}
if(strlen($comments) < 2) {
$error_message .= 'The Comments you entered do not appear to be valid.<br />';
}
if(strlen($error_message) > 0) {
died($error_message);
}
$email_message = "Form details below.\n\n";
function clean_string($string) {
$bad = array("content-type","bcc:","to:","cc:","href");
return str_replace($bad,"",$string);
}
$email_message .= "Name: ".clean_string($name)."\n";
$email_message .= "Email: ".clean_string($email_from)."\n
$email_message .= "Comments: ".clean_string($comments)."\n";
// create email headers
$headers = 'From: '.$email_from."\r\n".
'Reply-To: '.$email_from."\r\n" .
'X-Mailer: PHP/' . phpversion();
@mail($email_to, $email_subject, $email_message, $headers);
?>
<!-- place your own success html here -->
<?php
}
die();
?>
答案 1 :(得分:4)
您已将动作lulzy.php
添加到表格
您需要将以下代码添加到该文件lulzy.php
<?php
$name= $_REQUEST['name'] ;
$email = $_REQUEST['email'] ;
$message = $_REQUEST['message'] ;
mail( "yourname@example.com", "Feedback Form Results",
$message, "From: $email" );
header( "Location: http://www.example.com/thankyou.html" );
?>
答案 2 :(得分:3)
好的,我已经在你的表单中添加了名称和id并创建了一个javascript函数validate()(我在我的标题中有这个) - 通过给出elementss id,然后通过id启用getelement 如果未输入所有字段,则onsubmit返回false。 html中的“email”元素更正了正确的电子邮件格式。 php是对垃圾邮件的双重检查。 希望这会有所帮助。
<div class="contact-form">
<form onsubmit="return Validate();" action="lulzy.php" action="post" name="contact">
<h6><img src="img/person.png" alt="" /> Name</h6>
<input type="text" placeholder="Please enter your full name here" name="fname" id="fname" />
<h6><img src="img/email.png" alt="" /> E-mail</h6>
<input type="email" placeholder="Please enter your e-mail address" name="email" id="email"/>
<h6><img src="img/message.png" alt="" /> Message</h6>
<textarea placeholder="Type your message..." name="message" id="message"/></textarea>
<input type="submit" value="Submit">
</form>
</div>
<script type="text/javascript">
function Validate()
{
// create array containing textbox elements
var inputs = [document.getElementById('fname'), document.getElementById('email'), document.getElementById('message')];
var error;
for(var i = 0; i<inputs.length; i++)
// loop through each element to see if value is empty
{
if(inputs[i].value == '')
{
error = 'Please complete all fields.';
alert(error);
return false;
}
}
}
include ("contact.html");
function spamcheck($field)
{
//filter_var() sanitizes the e-mail
//address using FILTER_SANITIZE_EMAIL
$field=filter_var($field, FILTER_SANITIZE_EMAIL);
//filter_var() validates the e-mail
//address using FILTER_VALIDATE_EMAIL
if(filter_var($field, FILTER_VALIDATE_EMAIL))
{
return TRUE;
}
else
{
return FALSE;
}
}
if (isset($_POST['submit'])) {
//process form data
//check if the email address is invalid
$mailcheck = spamcheck($_POST['email']);
if ($mailcheck==TRUE){
//send email
$email=$_POST['email'];
$fname=$_POST['fname'];
$message = $_POST['message'] ;
$subject="website contact";
mail("your email address", $subject ,$message , "From: $email");
echo '<script type="text/javascript"> alert("Your form has been submitted.")
答案 3 :(得分:1)
非常简单的解决方案,但也非常业余,将改变您的表单的action
。你可以这样做:
action="mailto:yourmail@domain;com"
更好的解决方案是创建一个提交页面,您可以使用PHP
处理表单。迷你示例:
$body = 'New email submitted:' . $_POST['email'];
mail( 'yourmail@domain.ext' , 'Contact form website' , $body )
上面的例子非常基本,只是为了让你先行一步!