我在使用PHP电子邮件表单时遇到问题。它是从我设计的另一个网站(可以正常工作)复制并粘贴的-我做过的唯一不同的事情是稍微更改了文件结构以使其整理。
以前,所有主要的html页面都位于根目录中,而组件文件(JS,PHP,图像,字体等)都位于html目录中-例如$root/contact us.html
,而组件位于{ {1}}。
这次,我刚刚删除了html目录,因此所有文件和文件夹都位于根目录中-例如-$ root / contact us.html,$root/html/js/forms.js
。
我已经更新了PHP和JS文件,因此它们都指向正确的方向,但是该表格现在无法正常工作。
有人能发现我做错了吗?
这是代码...
HTML
$root/js/forms.js
JS
<form id="project-contact-form" action="javascript:void(0)" method="post">
<div class="row">
<div class="col-12">
<div id="success-project-contact-form" class="vb-blue">Awesome - your message was sent! We'll be in touch soon.</div>
</div>
<div class="col-md-6">
<input type="text" name="name" id="name" placeholder="Name *" class="big-input">
</div>
<div class="col-md-6">
<input type="text" name="phone" id="phone" placeholder="Phone" class="big-input">
</div>
<div class="col-md-6">
<input type="text" name="email" id="email" placeholder="E-mail *" class="big-input">
</div>
<div class="col-md-6">
<div class="select-style big-select">
<select name="subject" id="subject" class="big-input">
<option value="">What's your message about?</option>
<option value="general">- a general enquiry</option>
<option value="product">- product related</option>
<option value="delivery">- about a delivery</option>
<option value="complaint">- a complaint</option>
<option value="b2b">- a business proposal</option>
</select>
</div>
</div>
<div class="col-md-12">
<textarea name="comment" id="comment" placeholder="Your message" rows="6" class="big-textarea"></textarea>
</div>
<div class="col-md-12 text-center">
<button id="project-contact-us-button margin-bottom-35" type="submit" class="btn btn-medium btn-rounded white bg-vb-red sbold-txt">SEND MESSAGE</button>
</div>
</div>
</form>
和PHP
"use strict";
/*==============================================================
form to email
==============================================================*/
$("#success-project-contact-form").hide();
//Project Contact us form
$('#project-contact-us-button').on("click", function () {
var error = ValidationProjectContactForm();
if (error) {
$.ajax({
type: "POST",
url: "php/project-contact-form.php",
data: $("#project-contact-form").serialize(),
success: function (result) {
// Un-comment below code to redirect user to thank you page.
//window.location.href="thank-you.html";
$('input[type=text],textarea').each(function () {
$(this).val('');
})
$("#success-project-contact-form").html(result);
$("#success-project-contact-form").fadeIn("slow");
$('#success-project-contact-form').delay(4000).fadeOut("slow");
}
});
}
});
function ValidationProjectContactForm() {
var error = true;
$('#project-contact-form input[type=text]').each(function (index) {
if (index == 0) {
if ($(this).val() == null || $(this).val() == "") {
$("#project-contact-form").find("input:eq(" + index + ")").addClass("required-error");
error = false;
} else {
$("#project-contact-form").find("input:eq(" + index + ")").removeClass("required-error");
}
} else if (index == 2) {
if (!(/(.+)@(.+){2,}\.(.+){2,}/.test($(this).val()))) {
$("#project-contact-form").find("input:eq(" + index + ")").addClass("required-error");
error = false;
} else {
$("#project-contact-form").find("input:eq(" + index + ")").removeClass("required-error");
}
}
});
return error;
}
/*==============================================================
End form to email
==============================================================*/
谢谢您的建议!
答案 0 :(得分:1)
只需测试一下代码,错误就在您的html代码中,您拥有id="project-contact-us-button margin-bottom-35"
,如下面的代码所示。
<button id="project-contact-us-button margin-bottom-35" type="submit" class="btn btn-medium btn-rounded white bg-vb-red sbold-txt">SEND MESSAGE</button>
然后,您将点击事件处理程序分配给project-contact-us-button
//Project Contact us form
$('#project-contact-us-button').on("click", function () {
要使代码正常工作,请删除margin-bottom-35
。 ID不得包含此处www.w3schools.com/html/html_id.asp中指定的空格(空格,制表符等),我不知道这是否是错字,但这就是破坏代码的原因
<button id="project-contact-us-button" type="submit" class="btn btn-medium btn-rounded white bg-vb-red sbold-txt">SEND MESSAGE</button>
如果引用顶级目录,也请使用../
url: "../php/project-contact-form.php",