制作一个 html需要输入密码后才可以访问的网页或跳转源码-CSDN博客

本文链接：https://blog.csdn.net/lintingtingsug/article/details/147725388

资源介绍：

密码访问单页自定义跳转页面，修改了的密码访问单页，

添加了js自定义密码跳转页面。需要正确输入密码才能跳转目标网址。

资源截图：

代码：

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>您访问的网站开启密码保护功能，请输入访问密码</title>
	<link rel="stylesheet" type="text/css" href="style.css">
    
</head>
<body style="position: static;">
	<div id="psdp-wrap">
		<div class="psdp-cont">
			<span class="psdp-title">您访问的网站开启密码保护功能，请输入访问密码</span>
				<div class="psdp-input">
					<input class="psdp-btn" type="submit" id="chkBtn" value="确定" onclick="chkBtn()">
					<input class="psdp-pwd" type="password" name="accessPassword" id="password" placeholder="访问密码" >
					<div class="cfb"></div>
					<span class="padp-hint" id="notice_accessPassword" style="display:none">请输入访问密码！</span>
				</div>
			<p class="psdp-text">Copy 溯光笔记 2025</p>
		</div>
	</div>
</body>
<script>
        document.getElementById('chkBtn').addEventListener('click',function (){
		var password = document.getElementById("password").value;
		if(password == '123456'){//这里123456是密码
			window.location.href = 'https://www.suguang999.cn/';//这里改跳转页面
		}else{
			alert('抱歉，访问密码错误！')
		}
	})
    </script>
</html>