文章摘要
这篇文章介绍了码坐标-IDE权限认证页面的实现细节，内容主要围绕一个在线开发环境的权限管理功能。文章通过HTML表单和JavaScript脚本，展示了如何实现用户权限认证功能。表单包含了一个登录字段和一个密码字段，JavaScript脚本通过事件监听验证用户输入的密码是否正确，并在用户按下回车键时提交表单。文章的核心内容是围绕如何通过代码实现权限认证和登录功能的。
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”utf-8″ />
<meta name=”viewport”
content=”width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no” />
<title>码坐标-IDE权限认证</title>
<link rel=”icon” href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/media/favicon.ico” rel=”external nofollow” rel=”external nofollow” />
<link rel=”alternate icon” href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/media/favicon.ico” rel=”external nofollow” rel=”external nofollow” />
<link rel=”apple-touch-icon” sizes=”192×192″ href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/media/pwa-icon-192.png” rel=”external nofollow” />
<link rel=”apple-touch-icon” sizes=”512×512″ href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/media/pwa-icon-512.png” rel=”external nofollow” />
<link rel=”stylesheet” href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/pages/global.css” rel=”external nofollow” />
<link rel=”stylesheet” href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/pages/login.css” rel=”external nofollow” />
<meta id=”coder-options” data-settings=”{{OPTIONS}}” />
</head>
<body>
<div class=”center-container login-container”>
<div>
<form id=”loginForm” method=”post”>
<input id=”base” type=”hidden” name=”base” value=”{{BASE}}” />
<input id=”href” type=”hidden” name=”href” value=”” />
<input required autofocus class=”password” id=”password” type=”password” placeholder=”请输入授权口令” name=”password”
onkeydown=”validPass()” autocomplete=”off” />
</form>
</div>
</div>
<script>
const el=document.getElementById(“href”)
if (el) {
el.value=location.href
}
function validPass() {
var event=arguments.callee.caller.arguments[0] || window.event;
if (event.keyCode==13) {
let loginForm=document.getElementById(“loginForm”)
let password=document.getElementById(“password”).value
if (!password) {
return
}
loginForm.submit()
}
}
</script>
</body>
<html lang=”en”>
<head>
<meta charset=”utf-8″ />
<meta name=”viewport”
content=”width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no” />
<title>码坐标-IDE权限认证</title>
<link rel=”icon” href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/media/favicon.ico” rel=”external nofollow” rel=”external nofollow” />
<link rel=”alternate icon” href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/media/favicon.ico” rel=”external nofollow” rel=”external nofollow” />
<link rel=”apple-touch-icon” sizes=”192×192″ href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/media/pwa-icon-192.png” rel=”external nofollow” />
<link rel=”apple-touch-icon” sizes=”512×512″ href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/media/pwa-icon-512.png” rel=”external nofollow” />
<link rel=”stylesheet” href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/pages/global.css” rel=”external nofollow” />
<link rel=”stylesheet” href=”https://www.jb51.net/article/{{CS_STATIC_BASE}}/src/browser/pages/login.css” rel=”external nofollow” />
<meta id=”coder-options” data-settings=”{{OPTIONS}}” />
</head>
<body>
<div class=”center-container login-container”>
<div>
<form id=”loginForm” method=”post”>
<input id=”base” type=”hidden” name=”base” value=”{{BASE}}” />
<input id=”href” type=”hidden” name=”href” value=”” />
<input required autofocus class=”password” id=”password” type=”password” placeholder=”请输入授权口令” name=”password”
onkeydown=”validPass()” autocomplete=”off” />
</form>
</div>
</div>
<script>
const el=document.getElementById(“href”)
if (el) {
el.value=location.href
}
function validPass() {
var event=arguments.callee.caller.arguments[0] || window.event;
if (event.keyCode==13) {
let loginForm=document.getElementById(“loginForm”)
let password=document.getElementById(“password”).value
if (!password) {
return
}
loginForm.submit()
}
}
</script>
</body>
© 版权声明
文章版权归作者所有，未经允许请勿转载。
