使用Ajax注册在本地的服务器上创建一个mysql类型的数据库，叫register, 库中有一个名为user的数据表，包括以下字段：id(主键，自增), username, trueName, password, sex, age, favor, province, intro；创建一个html页面呈现用户注册表单，并对用户注册表单进行适当的美化，如各个表单元素对齐等；后台一个php页面，用于将注册数据的插入到数据库中。要求必须用jq ajax相关技术实现。结果保存到服务器个人文件夹里面，文件夹名称为学号+姓名。

时间: 2023-11-22 17:52:12 浏览: 110

很抱歉，作为一个AI语言模型，我没有本地服务器和文件夹访问权限，无法为您提供完整的解决方案。但是，我可以为您提供一些可以参考的代码示例。 HTML页面代码示例： ``` <!DOCTYPE html> <html> <head> <title>User Registration</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>User Registration Form</h1> <form id="register-form"> <label>Username:</label> <input type="text" name="username" required><br> <label>True Name:</label> <input type="text" name="trueName" required><br> <label>Password:</label> <input type="password" name="password" required><br> <label>Gender:</label> <input type="radio" name="sex" value="male" required>Male <input type="radio" name="sex" value="female" required>Female<br> <label>Age:</label> <input type="number" name="age" required><br> <label>Favorite:</label> <input type="text" name="favor"><br> <label>Province:</label> <select name="province" required> <option value="">--Select Province--</option> <option value="Beijing">Beijing</option> <option value="Shanghai">Shanghai</option> <option value="Guangdong">Guangdong</option> <option value="Zhejiang">Zhejiang</option> </select><br> <label>Introduction:</label> <textarea name="intro"></textarea><br> <input type="submit" value="Register"> </form> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="script.js"></script> </body> </html> ``` CSS样式表代码示例（style.css）： ``` label { display: inline-block; width: 100px; text-align: right; margin-right: 10px; } input[type="text"], input[type="password"], textarea { width: 200px; } select { width: 220px; } ``` JavaScript代码示例（script.js）： ``` $(document).ready(function() { $("#register-form").submit(function(event) { event.preventDefault(); // prevent default form submission // serialize form data into JSON format var formData = JSON.stringify($(this).serializeArray()); // send AJAX request to server-side PHP script $.ajax({ url: "register.php", type: "POST", data: {formData: formData}, dataType: "json", success: function(response) { if (response.status == 1) { alert("Registration successful!"); $("#register-form")[0].reset(); // reset form after successful registration } else { alert("Registration failed: " + response.message); } }, error: function(jqXHR, textStatus, errorThrown) { alert("AJAX error: " + textStatus + " - " + errorThrown); } }); }); }); ``` PHP代码示例（register.php）： ``` <?php // check if form data is received if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST["formData"])) { // decode JSON data $formData = json_decode($_POST["formData"], true); // connect to MySQL database $servername = "localhost"; $username = "root"; $password = "password"; $dbname = "register"; $conn = mysqli_connect($servername, $username, $password, $dbname); // check connection if (!$conn) { die("Connection failed: " . mysqli_connect_error()); } // escape form data to prevent SQL injection $username = mysqli_real_escape_string($conn, $formData[0]["value"]); $trueName = mysqli_real_escape_string($conn, $formData[1]["value"]); $password = mysqli_real_escape_string($conn, $formData[2]["value"]); $sex = mysqli_real_escape_string($conn, $formData[3]["value"]); $age = mysqli_real_escape_string($conn, $formData[4]["value"]); $favor = mysqli_real_escape_string($conn, $formData[5]["value"]); $province = mysqli_real_escape_string($conn, $formData[6]["value"]); $intro = mysqli_real_escape_string($conn, $formData[7]["value"]); // insert form data into database $sql = "INSERT INTO user (username, trueName, password, sex, age, favor, province, intro) VALUES ('$username', '$trueName', '$password', '$sex', '$age', '$favor', '$province', '$intro')"; if (mysqli_query($conn, $sql)) { $response = array("status" => 1, "message" => "Registration successful!"); } else { $response = array("status" => 0, "message" => "Error: " . $sql . " - " . mysqli_error($conn)); } // close database connection mysqli_close($conn); // send JSON response back to client-side JavaScript header("Content-type: application/json"); echo json_encode($response); } ?>

阅读全文

相关推荐

使用jQuery和Ajax实现关键词数据搜索教程

使用Ajax高效发送表单数据到服务器

实现MySQL数据库单页面Ajax增删改查的教程

Ajax+php+mysql实现登陆注册!

java ajax注册

django-crud-ajax-login-register-fileupload：Django Crud，Django Crud应用程序，Django ajax CRUD，Django Boilerplate应用程序，Django Register，Django Login，Django fileupload，CRUD，Bootstrap，AJAX，示例应用程序

React与Node.js实现的用户注册及MySQL数据检索系统

基于AJAX技术，在用户注册时，校验用户名是否在数据已存在数据库中。请给出源代码

用PHP写一个登录注册页面，要有用户展示页面，能连接数据库，有退出登录功能以及要用到Ajax

做一个注册登录网页，用户信息添加到数据库。提供代码

springboot+ajax+layui+mysql实现注册（id自增，姓名，密码，部门，入职时间，性别，年龄）

我想使用JSPJSP 和 Bootstrap 开发的注册失败页面，当用户名与数据库中已有的内容重复时时会自动跳转回登录页面，

Python使用Echarts实时连接MySQL数据库并展示数据图

使用jQuery和PHP构建Ajax驱动的电话本应用

最新推荐

【中国房地产业协会-2024研报】2024年第三季度房地产开发企业信用状况报告.pdf

JHU荣誉单变量微积分课程教案介绍

管理建模和仿真的文件

【实战篇：自定义损失函数】：构建独特损失函数解决特定问题，优化模型性能

如何在ZYNQMP平台上配置TUSB1210 USB接口芯片以实现Host模式，并确保与Linux内核的兼容性？

Naruto爱好者必备CLI测试应用

"互动学习：行动中的多样性与论文攻读经历"

【强化学习损失函数探索】：奖励函数与损失函数的深入联系及优化策略

如何在Springboot后端项目中实现前端的多人视频会议功能，并使用Vue.js与ElementUI进行界面开发？

Android应用显示Ignaz-Taschner-Gymnasium取消课程概览