首页用html加js加ajax写一个能与后端相连实现用户登录的代码，把后端地址表明，并加以注释

用html加js加ajax写一个能与后端相连实现用户登录的代码，把后端地址表明，并加以注释

时间: 2023-03-25 20:04:37 浏览: 56

好的，以下是代码： <!DOCTYPE html> <html> <head> <title>用户登录</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("#login-btn").click(function(){ var username = $("#username").val(); var password = $("#password").val(); $.ajax({ url: "http://example.com/login", type: "POST", data: {username: username, password: password}, success: function(result){ if(result == "success"){ alert("登录成功！"); }else{ alert("用户名或密码错误！"); } } }); }); }); </script> </head> <body> <h1>用户登录</h1> <form> <label for="username">用户名：</label> <input type="text" id="username" name="username"><br><br> <label for="password">密码：</label> <input type="password" id="password" name="password"><br><br> <input type="button" id="login-btn" value="登录"> </form> </body> </html> 注释： 1. 引入 jQuery 库。 2. 当页面加载完成后，绑定登录按钮的点击事件。 3. 获取用户名和密码。 4. 发送 POST 请求到后端地址 http://example.com/login，传递用户名和密码。 5. 如果登录成功，弹出提示框“登录成功！”；否则，弹出提示框“用户名或密码错误！”。 6. HTML 表单，包含用户名、密码和登录按钮。