<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>文件实验室/账号登录</title> <style> body { font-family: "楷体", serif; } .container { display: flex; flex-direction: row; align-items: center; justify-content:
space-between; padding: 20px; } .input-container { display: flex; flex-direction: row; align-items: center; margin-right: 20px; width: 50%; } input[type="
email"], input[type="text"] { padding: 10px; font-size: 16px; border: none; border-radius: 5px; margin-right: 10px; width: 100%; } #get-verification-code-btn, #login-btn { padding: 10px; font-size: 16px; background-color: #4CAF50; color: white; border: none; border-radius: 5px; cursor: pointer; } #get-verification-code-btn.disabled { background-color: grey; cursor: not-allowed; } </style> </head> <body> <div class="container"> <h1>文件实验室/账号登录</h1> <div class="input-container"> <input type="
email" placeholder="输入接收验证码的邮箱"> <button id="get-verification-code-btn">获取验证码</button> </div> <div class="input-container"> <input type="text" placeholder="输入验证码"> <button id="login-btn">登录</button> </div> </div> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> var timer; var countdown = 60; function disableBtn() { $('#get-verification-code-btn').addClass('disabled'); $('#get-verification-code-btn').prop('disabled', true); timer = setInterval(function() { countdown--; $('#get-verification-code-btn').text(countdown + '秒后再试'); if (countdown == 0) { clearInterval(timer); enableBtn(); } }, 1000); } function enableBtn() { countdown = 60; $('#get-verification-code-btn').removeClass('disabled'); $('#get-verification-code-btn').prop('disabled', false); $('#get-verification-code-btn').text('获取验证码'); } $(document).ready(function() { $('#get-verification-code-btn').click(function() { disableBtn(); var
email = $('input[type="
email"]').val(); $.ajax({ type: "
POST", url: "/admin/", data: {
email:
email}, success: function(response) { console.log(response); // handle response }, error: function(error) { console.log(error); } }); }); $('#login-btn').click(function() { var verificationCode = $('input[type="text"]').val(); $.ajax({ type: "
POST", url: "/response/", data: {verificationCode: verificationCode}, success: function(response) { console.log(response); if (response == 'success') { window.location.href = 'https://www.
spacexs.cn'; } else { alert('验证码错误，请重新输入'); } }, error: function(error) { console.log(error); } }); }); }); </script> </body> </html>
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
