应用代码片段：

<!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. Qt tr 无法翻译

    项目中碰到部分tr无法翻译的问题,最后发现由于继承QObject的子类没有加上Q_OBJECT宏.

  2. 关于 Span 的一切：探索新的 .NET 明星: 3.什么是 Memory<T>，以及为什么你需要它？

    3. 什么是 Memory<T>,以及为什么你需要它? 1. Span<T> 是什么? 2. Span<T> 是如何实现的? 3. 什么是 Memory<T& ...

  3. bytecode 生成器

    基础 objectweb asm 很难用,找了几个高级点的. activej codegen 这个库很像 .net DLR 风格,采用 Expression 抽象,例如 Expressions.add ...

  4. 用 16G 内存存放 30亿数据（Java Map）转载

    在讨论怎么去重,提出用 direct buffer 建 btree,想到应该有现成方案,于是找到一个好东西: MapDB - MapDB : http://www.mapdb.org/ 以下来自:ko ...

  5. 【前端】【H5 API】实现文件读取操作

    H5 API 实现文件读取操作 该接口通过FileReader对象来读取本地存储的文件,然后使用File对象来指定读取的文件或数据 File对象 可以是来自用户在一个元素上(如<input> ...

  6. Windows下，terminal美化、命令行美化

    1. Terminal terminal 比 原生的 cmd 要更加好用 直接去 Micorosoft Store 下载就行了 2. 美化效果图 3. 美化步骤 3.1 需要的插件 git-alias ...

  7. 利用idea开发环境进行Spring Boot开发时maven同步更新jar依赖包时提示：sync:Cannot resolve xxx 的解决方案

    idea maven sync Cannot resolve xxx 的解决方案 经常会出现这种奇葩情况,提示找不到包 其实是因为网络波动或者突然断掉,导致包更新出现问题 直接去maven的仓库目录 ...

  8. ant利用ivy从maven仓库下载项目所依赖的jar包默认的存储位置

    ant利用ivy从maven仓库下载项目所依赖的jar包默认的存储位置为: 当前登录系统的用户目录下(如"C:\Users\Administrator\.ivy2\cache"), ...

  9. 怎么在 Linux 下运行 smart_rtmpd

    怎么在 Linux 下运行 smart_rtmpd 操作系统的准备 我们知道比较流行的 Linux 操作系统基本上分为两类,一类是以 Redhat 为基线的 Redhat, CentOS:另一类是 D ...

  10. AICA第6期-学习笔记汇总

    AICA第6期-学习笔记汇总 AICA第六期|预科班课程 1.<跨上AI的战车> 2.<产业中NLP任务的技术选型与落地> 3.<计算机视觉产业落地挑战与应对> 4 ...