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;
                }
            }
  • 相关阅读:
    数据库优化
    List,map,Set区别
    ID选择器
    最简单的添加删除行操作
    JQ2
    最简单的JQ实现
    20180416
    一行细分的HTML写法
    out参数的使用
    结构的使用
  • 原文地址:https://www.cnblogs.com/runningRain/p/13944116.html
Copyright © 2011-2022 走看看