AJAX 电子邮件表单无法提交
我的网站上有一个电子邮件注册表单，我最近添加了验证。
现在，表单不会发送或提供错误消息。当我检查检查器时，我看到以下错误：
TypeError: null is not an object (evaluating 'document.getElementById(update[0]).innerHTML = update[1]')
这是我的
contact.php
文件
<?php
$to = "[email protected]";
$subject_prefix = "";
if(!isset($_GET['action']))
$subject = "Newsletter Sign Up"; //The senders subject
$message = trim($_GET['email']); //The senders subject
$email = trim($_GET['email']); //The senders email address
if (!filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
mail($to,$subject,$message,"From: ".$email."");
echo 'contactarea|<div id="thanks">Thank you. We promise you won’t regret it.</div>';
else {
echo("$email is not a valid email address");
}
?>
这是我的 HTML 表单
<div id="contactarea">
<span style="font-family: 'Old Standard TT', serif;">Newsletter</span>
<form id="contactform" name="contactform" >
<input class ="email" type="text" name="email" id="inputbox" value="E-Mail"
onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/>
<input type="submit" value="Submit" name="send" onclick="sendemail(); return false; " class="signup" >
</form>
</div>
这是我的 javascript
<script language="javascript">
function createRequestObject() {
var ro;
var browser = navigator.appName;
if (browser == "Microsoft Internet Explorer") {
ro = new ActiveXObject("Microsoft.XMLHTTP");
} else {
ro = new XMLHttpRequest();
}
return ro;
}
var http = createRequestObject();
function sendemail() {
var email = document.contactform.email.value;
document.contactform.send.disabled = true;
http.open('get', 'contact.php?email=' + email + '&action=send');
http.onreadystatechange = handleResponse;
http.send(null);
setTimeout(function() {
jQuery(document).find("#thanks").fadeOut();
}, 3000);
}
function handleResponse() {
if (http.readyState == 4) {
var response = http.responseText;
var update = new Array();
if (response.indexOf('|' != -1)) {
update = response.split('|');
document.getElementById(update[0]).innerHTML = update[1];
}
}
}
</script>
任何见解都将不胜感激。
我认为这就是您要找的内容：
document.contactform.send.disabled=false;
在 html 页面中添加另一个 div，id =“msg”
替换
document.getElementById(update[0]).innerHTML = update[1];
用
您可以在此处添加条件
具体取决于您想要显示 upload[0] 还是 upload[1]
document.getElementById('msg').innerHTML = update[0]+update[1];
在 contact.php 中
else 之前缺少 '}'。
客户端和服务器端均存在多个错误。
Changes to javascript. Your form data wasn't being sent in the php call.
我已更改您的调用类型 get/post 并使用了 new FormData()。如果您想在调用中添加更多内容，请使用
formdata.append("ParamName", Value/Variable);
并使用
$something=$_POST['ParamName'];
以 PHP 形式获取帖子。
var formdata = new FormData();
formdata.append("email", email);
formdata.append("action", "send");
http.open('POST', 'contact.php');
http.onreadystatechange = handleResponse;
http.send(formdata);
Changes to PHP. You missed the opening/closing of the if statements.
您设置 javascript 的方式是，如果发布的电子邮件无效，您会拆分 php 回复 (|)，因为您的回显中没有 divID 和 bar(|)，因此会导致 JS 错误。
$to = "[email protected]";
$subject_prefix = "";
if(isset($_POST['action'])){ // ***** Missing ({)
$subject = "Newsletter Sign Up"; //The senders subject
$message = trim($_POST['email']); //The senders subject
$email = trim($_POST['email']); //The senders email address
if (!filter_var($email, FILTER_VALIDATE_EMAIL)===false) {
mail($to,$subject,$message,"From: ".$email."");
// **** Div ID Missing with Bar (contactarea|)
echo 'contactarea|<div id="thanks">Thank you. We promise you won\'t regret it.</div>';
// **** Else missing (})
}else {
echo("contactarea|$email is not a valid email address");
}
}// **** Close if issset (})
我希望我已在此答案中涵盖了您的所有问题。
如果您不理解任何内容，请在下面发表评论，我将更新答案以帮助您理解此答案中的任何内容。我宁愿您理解此源代码，而不仅仅是复制粘贴。您不会从复制/粘贴中学到东西。
Tip:Clean your php string before putting them into mail().
希望这能有所帮助。编码愉快！