js 设计协议只有用户读完才能勾选同意的按钮

最新推荐文章于 2022-12-26 17:46:47 发布

慢_时光

最新推荐文章于 2022-12-26 17:46:47 发布

阅读量4.9k

点赞数 2

分类专栏：用户协议文章标签： js

本文链接：https://blog.csdn.net/weixin_53029195/article/details/112751664

版权

本文介绍了如何使用JavaScript设计一个功能，使得用户必须阅读完协议后才能勾选同意按钮。通过HTML和CSS搭建基础结构，然后用JS实现滚动监听和勾选逻辑，当用户滚动到底部时解除勾选框和同意按钮的禁用状态。点击同意后，显示‘注册成功’的弹窗。文章包含各个阶段的效果展示及详细代码解析。

摘要由CSDN通过智能技术生成

js 设计协议只有用户读完才能勾选同意的按钮

1.给出一段html和css代码作为演示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        #license {
    
            width: 400px;
            height: 350px;
            border: 2px solid black;
            margin: 50px auto 0px;
            overflow: auto;
            text-indent: 2em;
        }

        #license>p {
    
            margin: 0;
        }

        #license>p:nth-of-type(1) {
    
            text-align: center;
        }

        #bottom {
    
            width: 200px;
            height: 50px;
            margin: 10px auto 0;
        }
    </style>
</head>
<body>
    
<div></div>

<div id="license">
    <p>****软件许可及服务协议</p>
    <p>
    	【首部及导言】
        欢迎您使用****软件及服务！
        为使用****软件（以下统称“本软件”）及服务（以下统称“本服务”），您应当阅读并遵守《****许可及服务协议》（以下简称“本协议”），以及《****服务协议》、《****规则》、《****隐私政策》《****保护指引》。请您务必审慎阅读、充分理解各条款内容，特别是免除或者限制****责任的条款、对用户权利进行限制的条款、约定争议解决方式和司法管辖的条款（如第十五条相关约定）等，以及开通或使用某项服务的单独协议。限制、免责条款或者其他涉及您重大权益的条款可能以加粗、加下划线等形式提示您重点注意。
        除非您已充分阅读、完全理解并接受本协议所有条款，否则您无权下载、安装或使用本软件和/或相关服务。您点击“同意”、“下一步”或您的下载、安装、使用、登录等行为或者您以其他任何明示或者默示方式表示接受本协议的，即视为您已阅读并同意本协议的约束。本协议即在您与****之间产生法律效力，成为对双方均具有约束力的法律文件。
        如果您因年龄、智力等因素而不具有完全民事行为能力，请在法定监护人（以下简称“监护人”）的陪同下阅读和判断是否同意本协议。
        如果您是非中国大陆地区的用户，您订立或履行本协议以及使用本服务的行为还需要同时遵守您所属和/或所处国家或地区的法律。
    </p>

最低0.47元/天解锁文章

慢_时光

关注

2
点赞
踩
30

收藏

觉得还不错? 一键收藏
0
评论
js 设计协议只有用户读完才能勾选同意的按钮

js 设计协议只有用户读完才能勾选同意的按钮1.给出一段html和css代码作为演示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> #license { width: 400px;
复制链接

扫一扫