我應該用聯系表解決一個問題，但我不知道該把手放在哪里了。
我有一個 HTML 表單，然后是 JS 驗證，最后是一封用 PHP 發送的電子郵件。
表格資料為：姓名??、診所、電子郵件、電話、地址和估價。
在我收到的電子郵件中的資料是：
名稱：名稱在表單中輸入
電子郵件：電子郵件形式進入
診所：未定義
電話：未定義
地址：未定義
Valutation：未定義
這是代碼（HTML JS）：
// JavaScript Document
$(document).ready(function() {
"use strict";
$(".contact-form").submit(function(e) {
e.preventDefault();
var name = $(".name");
var email = $(".email");
var clinic = $(".clinic");
var phone = $(".phone");
var address = $(".address");
var valutation = $(".valutation");
var subject = $(".subject");
var msg = $(".message");
var flag = false;
if (name.val() == "") {
name.closest(".form-control").addClass("error");
name.focus();
flag = false;
return false;
} else {
name.closest(".form-control").removeClass("error").addClass("success");
}
if (email.val() == "") {
email.closest(".form-control").addClass("error");
email.focus();
flag = false;
return false;
} else {
email.closest(".form-control").removeClass("error").addClass("success");
}
var dataString = "name=" name.val() "&email=" email.val() "&subject=" subject.val() "&msg=" msg.val() "&clinic=" clinic.val() "&phone=" phone.val() "&address=" address.val() "&valutation=" valutation.val();
$(".loading").fadeIn("slow").html("Loading...");
$.ajax({
type: "POST",
data: dataString,
url: "php/contactForm.php",
cache: false,
success: function(d) {
$(".form-control").removeClass("success");
if (d == 'success') // Message Sent? Show the 'Thank You' message and hide the form
$('.loading').fadeIn('slow').html('<font color="#48af4b">Mail sent Successfully.</font>').delay(3000).fadeOut('slow');
else
$('.loading').fadeIn('slow').html('<font color="#ff5607">Mail not sent.</font>').delay(3000).fadeOut('slow');
}
});
return false;
});
$("#reset").on('click', function() {
$(".form-control").removeClass("success").removeClass("error");
});
})<div class="row justify-content-center">
<div class="col-lg-10 col-xl-8">
<div class="form-holder">
<form class="row contact-form" method="POST" action="php/contactForm.php" id="contactForm">
<!-- Form Select -->
<div class="col-md-12 input-subject">
<p class="p-lg">This question is about: </p>
<span>How satisfied are you with the service that Lab offers? </span>
<select class="form-select subject" aria-label="Default select example" name="valutation">
<option>Very unsatisfied</option>
<option>Unsatisfied</option>
<option>Satisfied</option>
<option>Very satisfied</option>
<option selected>I don't have an opinion</option>
</select>
</div>
<!-- Contact Form Input -->
<div class="col-md-12">
<p class="p-lg">Your Name: </p>
<span>Please enter your Dentist Name: </span>
<input type="text" name="name" class="form-control name" placeholder="Your Name*">
</div>
<div class="col-md-12">
<p class="p-lg">Clinic Name: </p>
<span>Please enter your Clinic Name: </span>
<input type="text" name="clinic" class="form-control name" placeholder="Clinic Name*">
</div>
<div class="col-md-12">
<p class="p-lg">Your Email Address: </p>
<span>Please carefully check your email address for accuracy</span>
<input type="text" name="email" class="form-control email" placeholder="Email Address*">
</div>
<div class="col-md-12">
<p class="p-lg">Phone Number: </p>
<span>Please enter your/clinic phone number: </span>
<input type="text" name="phone" class="form-control name" placeholder="Phone Number*">
</div>
<div class="col-md-12">
<p class="p-lg">Address: </p>
<span>Please enter Clinic Address: </span>
<input type="text" name="address" class="form-control name" placeholder="Address*">
</div>
<!-- Contact Form Button -->
<div class="col-md-12 mt-15 form-btn text-right">
<button type="submit" class="btn btn-skyblue tra-grey-hover submit">Submit Request</button>
</div>
<!-- Contact Form Message -->
<div class="col-lg-12 contact-form-msg">
<span class="loading"></span>
</div>
</form>
</div>
</div>
</div>這是PHP代碼：
<?php
$name = $_REQUEST["name"];
$email = $_REQUEST["email"];
$clinic = $_REQUEST["clinic"];
$phone = $_REQUEST["phone"];
$address = $_REQUEST["address"];
$valutation = $_REQUEST["valutation"];
$to = "[email protected]";
if (isset($email) && isset($name)) {
$email_subject = "Request to access to the Price List";
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=iso-8859-1" . "\r\n";
$headers .= "From: ".$name." <".$email.">\r\n"."Reply-To: ".$email."\r\n" ;
$msg = "From: $name<br/> Email: $email <br/> Clinic: $clinic <br/> Phone: $phone <br/> Address: $address <br/> Valutation: $valutation";
$mail = mail($to, $email_subject, $msg, $headers);
if ($mail) {
echo 'success';
} else {
echo 'failed';
}
}
?>
uj5u.com熱心網友回復：
你的問題是你的選擇器。您只使用類 name和email所有輸入。
<input type="text" name="phone" ...>
實際上應該是：
<input type="text" name="phone" ...>
等等所有其他輸入。將您的選擇器更改為適當的 classNames。
此外，從來沒有 只使用即：$(".name");， $(".email");等作為你的選擇。如您所知，您的檔案中的每一項都$(".name");將得到。所有其他選擇器也是如此。相反，使用第二個引數 ( ParentElement ) 將搜索僅限于提供的parent的子元素：
var name = $(".name", this);
或者更確切地說，使用屬性選擇器，例如：
var clinic = $(`[name="clinic"]`, this);
關于驗證的重要說明：
永遠不要相信客戶。
JS 驗證應該最少使用，就像一個 UX 工具來幫助，通知用戶基本的錯誤/錯別字。在真正的驗證，以及所有相關的錯誤反應，應在后端側進行處理。
目前您的 PHP 似乎很容易受到 XSS 攻擊。
您不需要 HTML<form>即可將資料發送到服務器。攻擊者只需找到您的路由/路徑（通常通過表單的action屬性公開），查看源中的名稱并手動構建 HTTP 請求，并將危險的任意資料發送到您的服務器。只是讓你記住。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/337049.html
標籤：javascript php html 形式 联系人