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;
}
}
JavaScript 滚动条滚动到底部才触发按钮是否可用的更多相关文章
- jQuery 滚动条 滚动到底部(下拉到底部) 加载数据(触发事件、处理逻辑)、分页加载数据
1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...
- js 滚动条滚动到底部触发事件
一.前言 在开发项目时,常常需要展示大量数据.如果全部显示出来,数据相对少时,看不出来什么不同,如果数据很多时,一次请求全部显示,这就相当可怕了. 面对这种问题,PC里使用了分页效果,将数据分成一页页 ...
- 手机网页,div内滚动条,以及div内部滚动条拉到底部之后触发事件
var gao = document.documentElement.clientHeight; var headHeight = parseInt($('.yhead').css('height') ...
- asp.net---jquery--ajax 实现滚动条滚动到底部分页显示
前台:aspx页面 var bgtime = $(" #date1 ").val(); var overtime = $(" #date2 ").val(); ...
- js滚动条滚动到底部触发事件
$("#contain").scroll(function(){ var $this =$(this), viewH =$(this).height(),//可见高度 conten ...
- 关于div的滚动条滚动到底部,内容显示不全的问题。(已解决)
今天我做了一个带有滚动条,底部有两个按钮的div. 当我拖动滚动条到底部, 按钮没有显示出来. 我看了看我的样式设置,是这样的: /* 内容样式 */ #contentPartDiv{ posit ...
- 点击panel滚动条滚动到底部
$('#accordion').on('shown.bs.collapse', function () { var container = $(".admin-user .mx-scroll ...
- angular浏览器滚动条滚动到指定element 触发事件
angular.module('app').directive('ScrollTrigger', () => { return { restrict: "A", link:f ...
- 当滚动条滚动到页面底部自动加载增加内容的js代码
这篇文章主要介绍了如何使用javscript实现滚动条滚动到页面底部自动加载增加页面内容,需要的朋友可以参考下..1,注册页面滚动事件,window.onscroll = function(){ }; ...
- javascript实现 滚动条滚动 加载内容
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- JavaScript 样式操作
1.类名操作 class类名以字符串的形式存储到标签和Dom元素的属性中,标签属性为class,Dom元素属性为className,两个属性是均支持读取和修改,修改其中的一个会同步至另一个属性 cla ...
- Java基础面试:关键字与注释
Java 中的关键字 什么是关键字 Java 关键字是 Java 语言中预先定义好的.具有特殊含义的标识符.这些标识符在程序中有固定的用途,不能用作变量名.方法名或类名.Java 中共有 53 个特殊 ...
- vscode代码注释插件koroFileHeader配置(自用)
前言 一直以来写注释都是让人头疼的问题,力求保持注释风格统一也很麻烦,偶然间发现的这款vscode中的注释插件koroFileHeader,配置好后可以大大提高写注释的效率与积极性♪(∇*) 安装插件 ...
- 【SpringMVC】获取请求参数的方式
SpringMVC获取请求参数的方式 目录 SpringMVC获取请求参数的方式 方式1:ServletAPI 方法2:通过控制器方法的形参获取请求参数 方法3:@RequestParam 方法4:@ ...
- shell脚本忽略错误继续执行
在 shell 脚本中,可以使用 set -e 命令来设置脚本在遇到错误时退出执行.如果你希望脚本忽略错误并继续执行,可以在脚本开头添加 set +e 命令来取消该设置. 例如,下面是一个忽略错误并继 ...
- jQuery ajax - serializeArray() 方法 实例表单提交
serializeArray()在ajax表单提交时候非常方便获取元素 定义和用法 serializeArray() 方法通过序列化表单值来创建对象数组(名称和值). 您可以选择一个或多个表单元素(比 ...
- Qt/C++音视频开发81-采集本地麦克风/本地摄像头带麦克风/桌面采集和麦克风/本地设备和桌面推流
一.前言 随着直播的兴起,采集本地摄像头和麦克风进行直播推流,也是一个刚需,最简单的做法是直接用ffmpeg命令行采集并推流,这种方式简单粗暴,但是不能实时预览画面,而且不方便加上一些特殊要求.之前就 ...
- 这可能是国内Qt/C++界最受欢迎开源项目之一/5.8Kstar/持续迭代更新
一.前言 本项目大概在2020年开始的,大概在2022年重写了一遍,主要是分门别类存放.本项目主要是QWidget编写的一些开源的demo,支持Qt4.Qt5.Qt6,支持任意系统,预计会有100多个 ...
- EPPlus使用方法---Excel处理我觉得超级好用
目前只是用到导出Excel功能,导出大规模数据量速度也很快,而且比较容易操作(最起码导出是,暂时没有用到处理已存在的excel功能,有人说NPOI也好用,试了一下,最起码导出这个不如EPPlus ...
- dotnet最小webApi开发实践
dotnet最小webApi开发实践 软件开发过程中,经常需要写一些功能验证代码.通常是创建一个console程序来验证测试,但黑呼呼的方脑袋界面,实在是不讨人喜欢. Web开发目前已是网络世界中的主 ...