This question already has an answer here:
Not page reload function is not working of jQuery [closed]
（1个答案）
4年前关闭。
这是索引页：
这是
这是提交按钮上的jQuery函数。不重新加载页面并定向到
该功能未运行。当我按下提交按钮时，它再次重新加载页面index.php
Submit.php
请帮助我..我被困在这里
现在在您的validate.php文件中，如果它返回“ Input Valid”，则您的jquery将显示responseDiv并将其innerHTML设置为您设置为成功验证html的任何内容。
（1个答案）
4年前关闭。
这是索引页：
<?php
// Initialize variables to null.
$nameError ="";
$emailError ="";
$genderError ="";
$websiteError ="";
// On submitting form below function will execute.
if(isset($_POST['submit'])){
if (empty($_POST["name"])) {
$nameError = "Name is required";
} else {
$name = test_input($_POST["name"]);
// check name only contains letters and whitespace
if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
$nameError = "Only letters and white space allowed";
}
}
if (empty($_POST["lastname"])) {
$nameError = "Name is required";
} else {
$name = test_input($_POST["lastname"]);
// check name only contains letters and whitespace
if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
$nameError = "Only letters and white space allowed";
}
}
if (empty($_POST["email"])) {
$emailError = "Email is required";
} else {
$email = test_input($_POST["email"]);
// check if e-mail address syntax is valid or not
if (!preg_match("/([\w\-]+\@[\w\-]+\.[\w\-]+)/",$email)) {
$emailError = "Invalid email format";
}
}
if (empty($_POST["phonenumber"])) {
$nameError = "phone number is required";
} else {
$name1 = test_input($_POST["phonenumber"]);
// check name only contains letters and whitespace
if (!preg_match("/^[0-9 ]*$/",$name1)) {
$phoneerror = "Only numbers and white space allowed";
}
}
if (empty($_POST["section"])) {
$selectError = "Choose the required field";
} else {
$select = test_input($_POST["section"]);
}
if (empty($_POST["section1"])) {
$selectError = "Choose the required field";
} else {
$select = test_input($_POST["section1"]);
}
}
function test_input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Job Test</title>
<link href="style.css" rel="stylesheet">
<script src = "http://code.jquery.com/jquery-1.11.1.min.js"> </script>
<script src = "script1.js"></script>
</head>
<body>
<div class="maindiv">
<div class="form_div">
<div class="title">
<h2>Find Out More About Computing</h2>
</div>
<form method="post" action="index.php">
Name: <br />
<input class="input" name="name" type="text" value="" required placeholder="Enter name">
<span class="error">* <?php echo $nameError;?></span>
<br />
Last Name: <br />
<input class="input" name="lastname" type="text" value="" required placeholder="Enter last name">
<span class="error">* <?php echo $nameError;?></span>
<br />
E-mail: <br />
<input class="input" name="email" type="text" value="" required placeholder="Enter Email">
<br />
<span class="error">* <?php echo $emailError;?></span>
<br />
Mobile Phone Number: <br />
<input class="input" name="phonenumber" type="text" value="" required placeholder="Enter Phone Number">
<span class="error">* <?php echo @$phoneerror;?></span>
<br />
Citizenship: <br />
<select class="select" name="section" required >
<option value="None" >None</option>
<option value="Austrilian" >AUSTRALIA</option>
<option value="india" >INDIA</option>
<option value="others" >OTHERS</option>
</select>
<span class="error">*<?php echo @$selectError;?></span>
<br />
Are You a Permanent Resident of Australia
<br />
<select class="select" name="section1" required >
<option value="None" >None</option>
<option value="YES" >YES</option>
<option value="NO" >NO</option>
</select>
<span class="error">*<?php echo @$selectError;?></span>
<br />
<button class="submit" id="submit" name="submit" type="button" value="submit">Submit</button>
</form>
</div>
</body>
</html>
这是
index.php格式的html页面这是提交按钮上的jQuery函数。不重新加载页面并定向到
submit.php $(document).ready(function() {
$('#submit').click(function(e){
// e.preventDefault();
// var page = $(this).attr('id');
// $('#content').location.reload('content/submit.php');
// alert('ok');
});
//function submit_form()
//{
// var page = $(this).attr('id');
window.location.reload('content/submit.php');
//}
});
该功能未运行。当我按下提交按钮时，它再次重新加载页面index.php
Submit.php
<div id="content">
<h2 style="color:#FF0000;"> Thanks For the Submission </h2>
</div>
请帮助我..我被困在这里
最佳答案
正如您所说的，这是一项工作测试，我不会为您编写代码，但会向您显示您要去哪里。首先，索引文件和验证文件必须是2个单独的文件。这样做的原因是，我们将对validate.php文件进行AJAX调用，并且您希望它返回一个值而不返回索引页的其余部分。
$('#submit').click(validateData());
function httpGet(theUrl){
//FETCH Data From Server
xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET", theUrl , false );
xmlhttp.send();
return xmlhttp.responseText;
}
function validateData(){
serverResponse="validate.php?"+httpGet$("#myForm").serialize();
if(serverResonse=="Input Valid"){
$("#responseDiv").html("HTML FOR SUCESSFULL VALIDATION");
$("#formDiv").css("display","none");
}else{
$("#responseDiv").html("VALIDATION ERRORS");
}
$("#responseDiv").css("display","inline");
} <!DOCTYPE html>
<html>
<head>
<title>Job Test</title>
<link href="style.css" rel="stylesheet">
<script src = "http://code.jquery.com/jquery-1.11.1.min.js"> </script>
<script src = "script1.js"></script>
</head>
<body>
<div class="maindiv">
<div id="responseDiv"></div>
<div id="formDiv" class="form_div">
<div class="title">
<h2>Find Out More About Computing</h2>
</div>
<form id='myForm'>
Name: <br />
<input class="input" name="name" type="text" value="" required placeholder="Enter name">
<span class="error">* <?php echo $nameError;?></span>
<br />
Last Name: <br />
<input class="input" name="lastname" type="text" value="" required placeholder="Enter last name">
<span class="error">* <?php echo $nameError;?></span>
<br />
E-mail: <br />
<input class="input" name="email" type="text" value="" required placeholder="Enter Email">
<br />
<span class="error">* <?php echo $emailError;?></span>
<br />
Mobile Phone Number: <br />
<input class="input" name="phonenumber" type="text" value="" required placeholder="Enter Phone Number">
<span class="error">* <?php echo @$phoneerror;?></span>
<br />
Citizenship: <br />
<select class="select" name="section" required >
<option value="None" >None</option>
<option value="Austrilian" >AUSTRALIA</option>
<option value="india" >INDIA</option>
<option value="others" >OTHERS</option>
</select>
<span class="error">*<?php echo @$selectError;?></span>
<br />
Are You a Permanent Resident of Australia
<br />
<select class="select" name="section1" required >
<option value="None" >None</option>
<option value="YES" >YES</option>
<option value="NO" >NO</option>
</select>
<span class="error">*<?php echo @$selectError;?></span>
<br />
< button class="submit" id="submit" name="submit" type="button" value="submit">Submit</button>
</form>
</div>
</body>现在在您的validate.php文件中，如果它返回“ Input Valid”，则您的jquery将显示responseDiv并将其innerHTML设置为您设置为成功验证html的任何内容。