我的页面在没有任何验证的情况下重定向php
问题描述：
我想提交没有填写数据的表单，请提供一个名字的提醒，但是当我点击确定提醒它重定向到pass2.php，它不应该像这样发生。我的意思是它应该保持在同一页面，即pass.php。我的页面在没有任何验证的情况下重定向php
这里是我的pass.php
<?php session_start();?>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap.css" rel="stylesheet" />
<link href="css/bootstrap-theme.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#submit").click(function(){
var name = document.getElementById('name').value;
var address = document.getElementById('address').value;
var city = document.getElementById('city').value;
var country = document.getElementById('country').value;
var lname = document.getElementById('lname').value;
var phone = document.getElementById('phone').value;
var state = document.getElementById('state').value;
var zip = document.getElementById('zip').value;
if(name.length == 0)
{
alert("please provide a first name");
} else if(address.length == 0)
{
alert("Please provide a Address");
}else if(city.length == 0)
{
alert("Please provide a city name");
}else if(country.length == 0)
{
alert("Please provide a country name");
}else if(lname.length == 0)
{
alert("Please provide a last name ");
}else if(phone.length == 0)
{
alert("Please provide a phone number");
}else if(state.length == 0)
{
alert("Please provide a state name");
}else if(zip.length == 0)
{
alert("Please provide a zip code");
}
});
});
function validateEmail(emailField){
var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
if (reg.test(emailField.value) == false)
{
alert('Invalid Email Address');
return false;
}
return true;
}
</script>
</head>
<script src="js/bootstrap.min.js"></script>
<body>
<form action="pass2.php" method="POST">
<div style="width:800px;">
<div style="float:left;width:350px;">
<div class="container-fluid">
<div class='container'>
<div class="form-group">
<label for='name' >First Name*: </label><br/>
<input type='text' name='name' id='name' class="form-control" style="width:20%;"
maxlength="50"
value="<?php if(isset($_POST['name'])) { echo htmlentities($_POST['name']);}?>"/>
<br />
<span id='contactus_name_errorloc' class='error' style="font-size: 12px;"></span>
</div>
</div>
<div class='container'>
<label for='email' >Email Id*:</label><br/>
<p id="demo">
<input type='text' name='email' id='email' maxlength="50"
onblur="validateEmail(this);" /><br/>
</div>
</p>
<span id='contactus_email_errorloc' class='error'
style="font-size: 14px;color:#D32626;background-color: #fff;font-weight: 800;"></span>
<div class='container'>
<label for='name' >Address*: </label><br/>
<input type='text' name='address' id='address'maxlength="50" />
<br/>
</div>
<div class='container'>
<label for='country' >City*:</label><br/>
<input type='text' name='city' id='city' maxlength="50" /><br/>
</div>
<div class='container'>
<label for='country' >Country*:</label><br/>
<input type='text' name='country' id='country' maxlength="50"/>
<br/>
<span id='contactus_country_errorloc' class='error' style="font-size: 12px;"></span>
</div>
<input type="submit" id= "submit" name="submit" value="Submit"/>
</div>
</div>
答
$(document).ready(function(){
$("form").submit(function(e){
var name = document.getElementById('name').value;
var address = document.getElementById('address').value;
var city = document.getElementById('city').value;
var country = document.getElementById('country').value;
var lname = document.getElementById('lname').value;
var phone = document.getElementById('phone').value;
var state = document.getElementById('state').value;
var zip = document.getElementById('zip').value;
if(name.length == 0)
{
e.preventDefault();
alert("please provide a first name");
} else if(address.length == 0)
{
e.preventDefault();
alert("Please provide a Address");
}else if(city.length == 0)
{
e.preventDefault();
alert("Please provide a city name");
}else if(country.length == 0)
{
alert("Please provide a country name");
}else if(lname.length == 0)
{
e.preventDefault();
alert("Please provide a last name ");
}else if(phone.length == 0)
{
e.preventDefault();
alert("Please provide a phone number");
}else if(state.length == 0)
{
e.preventDefault();
alert("Please provide a state name");
}else if(zip.length == 0)
{
e.preventDefault();
alert("Please provide a zip code");
}
首先创建JS检查的形式提交功能，然后使用JS事件对象，以防止从形式提交，如果有错误在里面。
答
您处于onsubmit事件的回调范围内，因此您也可以通过取消事件，以免表单被提交。更改
$("#submit").click(function(){
到
$("#submit").click(function(event){
，然后利用一切不顺心的事时（用户未填写任何东西，字段缺失等）
event.preventDefault()
顺便说一句，你的html代码不完整。 – reporter