php - Ajax 不发送 POST 数据
问题描述
我正在制作一个注册表单,其中脚本在通过 AJAX 使用的单独文件中执行。
我已经尝试通过这样做直接使用脚本<form action="assets/php/action.php?action=register method="post" id="registration-form">
并且它以这种方式工作但是我想使用 AJAX 来做到这一点。问题在于,如果我使用 AJAX,则 POST 数据不会发送到 action.php 文件。
我已尝试调试我的代码,但找不到导致问题的原因。
我的注册表:
<form action="#" method="POST" class="user" id="register-form">
<div id="regAlert"></div>
<div class="form-group row">
<div class="col-sm-12 mb-3 mb-sm-0">
<input type="text" name="name" id="name" class="form-control form-control-user"
placeholder="Name" required>
</div>
</div>
<div class="form-group">
<input type="email" class="form-control form-control-user" id="remail" name="email"
placeholder="Email Address" required>
</div>
<div class="form-group row">
<div class="col-sm-6">
<div id="passError" class="text-danger font-weight-bold"></div>
</div>
</div>
<div class="form-group row">
<div class="col-sm-6 mb-3 mb-sm-0">
<input type="password" class="form-control form-control-user"
id="rpassword" name="password" placeholder="Password" required minlength="8">
</div>
<div class="col-sm-6">
<input type="password" class="form-control form-control-user"
id="cpassword" name="cpassword" placeholder="Repeat Password" required minlength="8">
</div>
</div>
<input type="submit" value="Register Account" id="register-btn" name="register" class="btn btn-primary btn-user btn-block">
<hr>
</form>
我的 AJAX 脚本:(抱歉评论不是英文)
<script type="text/javascript">
$(document).ready(function() {
//Register Form Ajax Request
$("#register-btn").click(function(e) { //Kui registreerimis nuppu vajutatakse, siis
if($("#register-form")[0].checkValidity()) { //Kontrolli formi õigsust
e.preventDefault();
$("#register-btn").val('Creating Account...'); //Muudab registreerimis nupu teksti
if($("#rpassword").val() != $("#cpassword").val()) { //Kui paroolid ei ole samad siis näitab errori
$("#passError").text('* Passwords did not match!'); //Paroolide mitte sama olemise error
$("#register-btn").val('Register Account'); //Muudab registreerimis nupu teksti
} else { //Kui paroolid kattusid, siis
$("#passError").text(''); //Eemaldab paroolide mitte sama olemis errori kirja
$.ajax({
url: "assets/php/action.php",
method: 'POST',
data: $("register-form").serialize()+'&action=register',
success:function(data) {
$("#register-btn").val('Register Account'); //Muudab registreerimis nupu teksti
if(data === 'register') {
window.location = 'home.php';
} else {
$("#regAlert").html(data);
}
}
});
}
}
});
});
</script>
我的 action.php 文件:
<?php
session_start();
require_once 'auth.php';
$user = new Auth();
if(isset($_POST['action'])) {
if($_POST['action'] == 'register') {
$name = $user->test_input($_POST['name']);
$email = $user->test_input($_POST['email']);
$pass = $user->test_input($_POST['password']);
$hpass = password_hash($pass, PASSWORD_DEFAULT);
echo $name;
echo $email;
echo $pass;
if($user->user_exist($email)) { //Kontrollib kas selle meiliaadressiga on konto juba registreeritud, kui on siis
echo $user->showMessage('warning', 'This email is already registered'); //Saadab inimesele kirja, et selle emailiga on konto juba registeeritud, 'warning' tähendab teate tüüpi, teine tekst on kiri, mida saadab
} else { //Kui selle meiliaadressiga pole kasutajat veel registeeritud, siis
if($user->register($name, $email, $hpass)) {
echo 'register';
$_SESSION['user'] = $email;
} else {
echo $user->showMessage('danger', 'Something went wrong! Please try again later or contact support.');
}
}
print_r($_POST); //This only outputs that the action is register, no POST values are outputted
die();
}
}
?>
谢谢,尼米图。
解决方案
不要使用 AJAX。改用fetch
,你不需要像 jQuery 这样的外部库,效率更高。这是一个例子:
fetch('http://example.com/movies.json')
.then(response => response.json())
.then(data => console.log(data));
更多信息在这里:https ://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
推荐阅读
- vue.js - 在 Vue 模板中渲染表格
- c# - POST csv 文件 httpclient C# 和 application/x-www-form-urlencoded
- html - 使用 Ubuntu 时如何从 angular4 中删除哈希 (#)
- asp.net - Angular 5.2 使用 Asp.net core 2.1 更新到 Angular 6 Visual Studio mac 7.5.2
- r - Change the colour of a subset of labels in barplot R
- cloudcaptain - boxfuse 的默认配置参数
- java - 如何自定义 Spring Boot 横幅?
- ios - 如何从 iMessage 应用扩展添加应用内购买以销售 Stickes
- javascript - 来自 HTML 属性的 Javascript 数组未按预期执行功能
- javascript - 我的 javascript imacro 代码有什么问题