应用代码片段：

<!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;

            }

        }

JavaScript 滚动条滚动到底部才触发按钮是否可用的更多相关文章

  1. jQuery 滚动条 滚动到底部（下拉到底部） 加载数据(触发事件、处理逻辑)、分页加载数据

    1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...

  2. js 滚动条滚动到底部触发事件

    一.前言 在开发项目时,常常需要展示大量数据.如果全部显示出来,数据相对少时,看不出来什么不同,如果数据很多时,一次请求全部显示,这就相当可怕了. 面对这种问题,PC里使用了分页效果,将数据分成一页页 ...

  3. 手机网页，div内滚动条，以及div内部滚动条拉到底部之后触发事件

    var gao = document.documentElement.clientHeight; var headHeight = parseInt($('.yhead').css('height') ...

  4. asp.net---jquery--ajax 实现滚动条滚动到底部分页显示

    前台:aspx页面 var bgtime = $(" #date1 ").val(); var overtime = $(" #date2 ").val(); ...

  5. js滚动条滚动到底部触发事件

    $("#contain").scroll(function(){ var $this =$(this), viewH =$(this).height(),//可见高度 conten ...

  6. 关于div的滚动条滚动到底部，内容显示不全的问题。（已解决）

    今天我做了一个带有滚动条,底部有两个按钮的div.  当我拖动滚动条到底部, 按钮没有显示出来.  我看了看我的样式设置,是这样的: /* 内容样式 */ #contentPartDiv{ posit ...

  7. 点击panel滚动条滚动到底部

    $('#accordion').on('shown.bs.collapse', function () { var container = $(".admin-user .mx-scroll ...

  8. angular浏览器滚动条滚动到指定element 触发事件

    angular.module('app').directive('ScrollTrigger', () => { return { restrict: "A", link:f ...

  9. 当滚动条滚动到页面底部自动加载增加内容的js代码

    这篇文章主要介绍了如何使用javscript实现滚动条滚动到页面底部自动加载增加页面内容,需要的朋友可以参考下..1,注册页面滚动事件,window.onscroll = function(){ }; ...

  10. javascript实现 滚动条滚动 加载内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. uni-app 使用笔记

    1.前言 也不知道是我水平菜还是文档太烂,这个框架使用的过程中踩了无数的坑,屡次想砸键盘,最后贫穷让我平复了心情.为了纪念这段操蛋的日子,我决定把这些坑都记录下来. 2.数据请求 在实际的项目中,数据 ...

  2. CVE-2023-0461 漏洞分析与利用

    PS: 文章首发于补天社区 漏洞分析 tcp_set_ulp里面会分配和设置 icsk->icsk_ulp_data,其类型为 tls_context tcp_setsockopt do_tcp ...

  3. 07C++选择结构（1）——教学

    一.基础知识 1.关系运算符 因为我们要对条件进行判断,必然会用到关系运算符: 名称 大于 大于等于 小于 小于等于 等于 不等于 符号 > >= < <= == != 关系表 ...

  4. Flutter枚举

    Flutter枚举 Enum Extension 在Dart2.7版本,Dart新增了扩展函数,使枚举相关的代码定义.调用更加简洁 通过扩展枚举定义方法 定义一个元素枚举 enum Element { ...

  5. 1.mysql部署文档

    部署方式 1.docker上面部署 ● 部署最新版本 docker pull mysql:latest # 拉取最新版本的镜像文件 docker images # 查看已经安装的镜像文件 docker ...

  6. OpenTelemetry.NET API

    OpenTelemetry.NET API Status and Releases Tracing Metrics Logging 1.0 Alpha Beta 安装 dotnet add packa ...

  7. SAGA/TCC 就是 WORKFLOW!!!

    SAGA TCC 的本质就是一个 workflow, 用 activiti, conductor 或 zeebee 都可以实现. saga, tcc 依赖的状态机模型在 workflow 引擎一直在用 ...

  8. Rapid SCADA v6安装常见问题

    用了很多年的Rapid SCADA v5,现在官网已经推出了v6,就简单写一下有关v6的安装指南吧. 本指南面向Windows用户,不适用于linux用户 步骤 从官网下载Rapid SCADA最新的 ...

  9. Qt/C++音视频开发81-采集本地麦克风/本地摄像头带麦克风/桌面采集和麦克风/本地设备和桌面推流

    一.前言 随着直播的兴起,采集本地摄像头和麦克风进行直播推流,也是一个刚需,最简单的做法是直接用ffmpeg命令行采集并推流,这种方式简单粗暴,但是不能实时预览画面,而且不方便加上一些特殊要求.之前就 ...

  10. 基于开源IM即时通讯框架MobileIMSDK：RainbowChat-iOS端v8.0版已发布

    关于MobileIMSDK MobileIMSDK 是一套专门为移动端开发的开源IM即时通讯框架,超轻量级.高度提炼,一套API优雅支持 UDP .TCP .WebSocket 三种协议,支持 iOS ...