zoukankan      html  css  js  c++  java
  • JavaScript 滚动条滚动到底部才触发按钮是否可用

    应用代码片段:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <style type="text/css"> 
            #info{
                width: 300px;
                height: 400px;
                background-color: pink;
                overflow: auto;
            }
        </style>
        <script type="text/javascript">
            window.onload=function(){
            var info = document.getElementById("info");
            // alert(info.innerText);
            info.onscroll = function(){
                // alert("滚动");
                if(info.scrollHeight - info.scrollTop == info.clientHeight)
                {
                    var inputs = document.getElementsByTagName("input");
                    inputs[0].disabled = false;
                    inputs[1].disabled=false;
                }
            }
    
        };
        </script>
        
    </head>
    <body>
        <h3>欢迎亲爱的用户注册</h3>
        <p id="info">注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容
            注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容
            注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容
            注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容
            注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容
            注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容
            注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容
            注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容
            注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容注册需要看的协议内容
        </p>
        <input type="checkbox" disabled="disabled"> 我已阅读协议内容,会严格遵守
        <input type="submit" value="注册" disabled="disabled">
    </body>
    </html>

    判断逻辑:

            info.onscroll = function(){
                // alert("滚动");
                if(info.scrollHeight - info.scrollTop == info.clientHeight)
                {
                    var inputs = document.getElementsByTagName("input");
                    inputs[0].disabled = false;
                    inputs[1].disabled=false;
                }
            }
  • 相关阅读:
    win10下 Ubuntu 18.04 LTS 的安装及 rlt8821ce网卡驱动的安装
    网络:tcp/ip
    数据结构分类
    面向对象的solid原则
    mysql数据库的操作
    锁机制
    设计模式在项目中的应用
    aop动态代理底层实现模拟
    变量在内存的分配_复习
    java内部类及类加载顺序
  • 原文地址:https://www.cnblogs.com/runningRain/p/13944116.html
Copyright © 2011-2022 走看看