• 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;
                }
            }
  • 相关阅读:
    HTML标签和属性三
    HTML标签和属性二
    HTML标签和属性一
    小程序相关面试题
    Vue路由的hash模式与history模式的区别?
    android中VideoView播放sd卡上面的视频
    Android中app开机自启动的开发
    java中byte,byte[]和int之间的转换
    Android多activity启动两种方式浅谈
    Android开发用到的几种常用设计模式浅谈(一):组合模式
  • 原文地址:https://www.cnblogs.com/runningRain/p/13944116.html
Copyright © 2020-2023  润新知