我有一个HTML表单，验证效果很好，但如果我将信息保存添加到php文件，那么它不会验证。它应检查输入的值是否正确，如果是，则将信息保存到.csv文件
<!DOCTYPE html>
<html>
<head>
<title>Greaton</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" media="all" />
<script src="validation.js"></script>
</head>
<body>
<form name="form" method="post" action="csv.php">
<div class="container">
<div class="form">
<center><img src="logo.jpg" alt="logo" width="200" height="40"></center>
</br>
<h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus dapibus enim a
adipiscing hendrerit. Nam vei orci vitae metus posuere rhncus sed ac augue.
Aenean tempus, lectus a rhoncus vulputate, nisi tellus commodo quam, sit amet
egestas magna elit ac mauris. Name pretium erat leo,
id dignissim tortor tincidunt sed. Morbi id est ut tellus euismd convallis.</h1>
<h2>Pellentesque habitant morbi tristique senectus et netus malesuada fames ac turpis egestas.
Fusce egestas egestan ante, nec lobortis elit luctus id. Ut vulputate sem sit amet ipsum pretium,
feugiat gravida elit blandit. Donec varius omale mi, posuere rutrum erat placerat a.</h2>
<h2>Maecenas ullamcorper euismod justo vei dictum. <a href="">Aenean sodales fringilla</a></h2>
</br>
<label for="nimi">Nimi:</label>
<input id="nimi" class="contact" name="nimi" placeholder="Nimi Nimeste" tabindex="1" type="text" >
</br>
<label for="uisik">Isikukood:</label>
<input id="isikukood" class="contact" name="isik" placeholder="isikukood" type="text" > <br>
<label for="sugu"> Sugu:</label>
<label for="mees">Mees</label>
<input id="mees" class="contact" type="radio" name="Sugu" value="Mees" />
<label for="naine">Naine</label>
<input id="naine" class="contact" type="radio" name="Sugu" value="Naine" />
</br>
<label for="sunniaasta"> Sünniaasta:</label>
<input class="sunniaasta" maxlength="4" name="sunniaasta" placeholder="Sünniaasta" >
</br>
<label for="email">Email:</label>
<input id="email" class="contact" ="email" placeholder="greaton@greaton.ee" type="email"> </br>
<label for="telefon">Telefon:</label>
<input id="telefon" class="contact" name="telefon" placeholder="55555555" type="text">
</br>
<label for="asukoht"> Asukoht:</label>
<select class="select" name="asukoht">
<option selected>Vali asukoht</option>
<option>Harju Maakond</option>
<option >Hiiu Maakond</option>
<option>Ida-Viru Maakond</option>
<option>Jõgeva Maakond</option>
<option>Järva Maakond</option>
</select>
</br>
<label for="lisainfo">Lisainfo:</label>
<div class="text">
<textarea name="lisainfo" rows="8" class="contact" input id="lisainfo" cols="74"></textarea>
</br>
<input id="tingimused" class="contact" type="checkbox" name="tingimused" required="" type="text">Nõustun reeglite ja tingimustega <br>
<input id="uudiskiri" class="contact" type="checkbox" name="uudiskiri" type="text">
Soovin tellida uudiskirja<br>
<br>
<input class="buttom" name="submit" id="submit" tabindex="5" value="Esitan Avalduse" type="submit">
</div>
</form>
</div>
</div>
</body>
</html>
您将在下面看到我的所有验证功能：
function formValidation() {
var uname = document.registration.nimi;
var uadd = document.registration.isikukood;
var asukoht = document.registration.asukoht;
var telefon = document.registration.telefon;
var uemail = document.registration.email;
var umsex = document.registration.msex;
var ufsex = document.registration.fsex;
{
if(allLetter(uname)) {
if(alphanumeric(uadd)) {
var telefon = document.registration.telefon;
var uemail = document.registration.email;
var umsex = document.registration.msex;
var ufsex = document.registration.fsex;
{
if(allLetter(uname)) {
if(alphanumeric(uadd)) {
if(koht(asukoht)) {
if(allnumeric(telefon)) {
if(ValidateEmail(uemail)) {
if(validsex(umsex,ufsex)) {
}
}
}
}
}
}
}
}
return false;
function allLetter(uname) {
var letters = /^[A-Za-z0-9- ]/;
if(uname.value.match(letters)) {
return true;
} else {
alert('nimi on vale');
uname.focus();
return false;
}
}
function alphanumeric(uadd) {
var letters = /^[0-9]{11}$/;
if(uadd.value.match(letters)) {
return true;
} else {
alert('vale isikukood');
uadd.focus();
return false;
}
}
function koht(asukoht) {
if(asukoht.value == "Default") {
alert('Palu vali midagi listist');
asukoht.focus();
return false;
} else {
return true;
}
}
function allnumeric(telefon) {
var numbers = /^[0-9]+$/;
if(telefon.value.match(numbers)) {
return true;
} else {
alert('Telefoninumbris tohivad olla ainult numbrid');
telefon.focus();
return false;
}
}
function ValidateEmail(uemail) {
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(uemail.value.match(mailformat)) {
return true;
} else {
alert("Vale email");
uemail.focus();
return false;
}
}
function validsex(umsex,ufsex) {
x=0;
if(umsex.checked) {
x++;
}
if(ufsex.checked) {
x++;
}
if(x==0) {
alert('Select Male/Female');
umsex.focus();
return false;
} else {
alert('Form Succesfully Submitted');
window.location.reload()
return true;
}
}
与文件值交互的文件csv.php
if(isset($_POST["submit"])) {
$name = $_POST["nimi"];
$isik = $_POST["isik"];
$sunniaasta = $_POST["sunniaasta"];
$sugu = $_POST["sugu"];
$email = $_POST["email"];
$telefon = $_POST["telefon"];
$asukoht = $_POST["asukoht"];
$lisainfo = $_POST["lisainfo"];
$cvsData ='"Nimi","Isikukood","sunniaasta","sugu","email","telefon","asukoht","lisainfo"'.PHP_EOL;
$cvsData .= "\"$name\",\"$isik\",\"$sunniaasta\",\"$sugu\",\"$email\",\"$telefon\",\"$asukoht\",\"$lisainfo\"".PHP_EOL;
$fp = fopen("test.csv", "a");
if($fp) {
fwrite($fp,$cvsData); // Write information to the file
fclose($fp); // Close the file
}
}
?>
感谢您的关注！
答案 0 :(得分：0)
<强>问题：
它只会发生，因为当你用你的action属性调用php时，它直接传递值而不调用你的JavaScript函数。
解决方案：
从html表单中删除action标记和方法标记，并使用ValidateEmail函数附加ajax，将数据传递给csv.php文件。
示例：
function ValidateEmail(uemail)
{
//change the last else part to this:
else
{
msg=callPHP();
if(msg=="true")
alert('Form Succesfully Submitted');
else
alert('fail Submitted');
window.location.reload()
return true;
}
}
function callPHP(){
//change the else part use ajax to call the php here.
var uname = document.registration.nimi;
var uadd = document.registration.isikukood;
var asukoht = document.registration.asukoht;
var telefon = document.registration.telefon;
var uemail = document.registration.email;
var umsex = document.registration.msex;
var ufsex = document.registration.fsex;
$.ajax({
type:'POST',
url: "csv.php",
data: {uname:uname.value,uadd:uadd.value,asukoht:asukoht.value,...,...//like this pass the data to the php},
dataType:'JSON'
success:function(json)
{
//enter your result here.....
return json[0].response;
}
}
<强> PHP
<?php
$name = $_POST["nimi"];
$isik = $_POST["isik"];
$sugu = $_POST["sugu"];
$email = $_POST["email"];
$telefon = $_POST["telefon"];
$asukoht = $_POST["asukoht"];
$lisainfo = $_POST["lisainfo"];
$sunniaasta = $_POST["sunniaasta"];
$cvsData = '"Nimi","Isikukood","sunniaasta","sugu","email","telefon","asukoht","lisainfo"'.PHP_EOL;
$cvsData .= "\"$name\",\"$isik\",\"$sunniaasta\",\"$sugu\",\"$email\",\"$telefon\",\"$asukoht\",\"$lisainfo\"".PHP_EOL;
$fp = fopen("test.csv", "a");
if($fp)
{
fwrite($fp,$cvsData); // Write information to the file
fclose($fp); // Close the file
$data[]=array('respons'=> 'true');
}
json_encode($data);
?>