ListenerScoller () {
var pageIndex = 1;
var startX, startY;
document.addEventListener('touchstart',function (ev) {
startX = ev.touches[0].pageX;
startY = ev.touches[0].pageY;
}, false); let _this = this;
document.addEventListener('touchend',function (ev) {
var endX, endY;
endX = ev.changedTouches[0].pageX;
endY = ev.changedTouches[0].pageY;
var dy = startY - endY;
var reach = Boolean;
var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop; console.log(scrollTop);
document.documentElement.scrollHeight == document.documentElement.clientHeight || document.body.clientHeight(兼容苹果safari) + scrollTop ? reach = true : reach = false
console.log(reach) if(dy>30 && reach){
pageIndex++;
_this.setState({
isLoad:true
}) _ENV.post(_ENV.HOST+'/distributor/ticket-record?page='+pageIndex).then(data => {
let newData = data.data.list;
let original = _this.state.buys;
if(data.data.isLastPage){
_this.setState({
loadText:'没有更多数据'
})
}
let arr = original.concat(newData);
console.log(arr);
_this.setState({
buys:arr
});
}).catch(error=>{
console.log(error);
});
} }, false);
}

  

JS 原生JS 判断滚动条滑动到底部(兼容苹果safari)的更多相关文章

  1. JS 原生JS 判断滚动条滑动到底部

    window.addEventListener("scroll", function(event) { var scrollTop = document.documentEleme ...

  2. JS如何判断滚动条是否滚到底部

    判断滚动条到底部,需要用到DOM的三个属性值,即scrollTop.clientHeight.scrollHeight.   scrollTop为滚动条在Y轴上的滚动距离.   clientHeigh ...

  3. JS实现判断滚动条滚到页面底部并执行事件的方法

    需要了解三个dom元素,分别是:clientHeight.offsetHeight.scrollTop. clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那 ...

  4. jquery如何判断滚动条滚到页面底部并执行事件

    首先理解三个dom元素,分别是:clientHeight.offsetHeight.scrollTop. clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那 ...

  5. jquery判断滚动条是否到底部

    clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那个这个高度则是不包括滚动条没显示出来的下面部分的内容.而只是单纯的DIV的高度. offsetHeight ...

  6. js原生封装自定义滚动条

    /* * @Author: dothin前端 * @Date: 2015-11-21 00:12:15 * @Last Modified by: dothin前端 * @Last Modified t ...

  7. js 原生JS实现轮播图

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. jsonrpc.js -- 原生js实现 JSON-RPC 协议

    很早以前就涉及到多端远程调用 api的设计,那时候自己设计了个消息传递回调过程.最近了解了JSON-RPC协议,更正规,就可以自己实现下.逻辑也不复杂,没有限制底层消息传递的方式,可以应用到更多的场景 ...

  9. JQuery 判断滚动条是否到底部

    BottomJumpPage: function () { var scrollTop = $(this).scrollTop(); var scrollHeight = $(document).he ...

随机推荐

  1. Fiddler实现手机抓包——小白入门 - 做一个不动声色的大人

    手机用fiddler抓包 电脑最好是笔记本,这样能和手机保持统一局域网内:其他不多说,直接说步骤了. 一.对PC(笔记本)参数进行配置    1. 配置fiddler允许监听到https(fiddle ...

  2. std::mutex

    构造函数,std::mutex不允许拷贝构造,也不允许 move 拷贝,最初产生的 mutex 对象是处于 unlocked 状态的. lock(),调用线程将锁住该互斥量.线程调用该函数会发生下面 ...

  3. Objective-C代码学习大纲(1)

    2011-05-11 14:06 佚名 otierney 字号:T | T 本文为台湾出版的<Objective-C学习大纲>的翻译文档,系统介绍了Objective-C代码,很多名词为台 ...

  4. [Android Tips] 26. Multiple Maven repositories in Gradle

    来自 https://gradleproject.wordpress.com/2013/02/14/multiple-maven-repositories-in-gradle/ This DOESN' ...

  5. coderfun-boot接私活利器,文档详实,非一般的开发速度

    项目主页:https://gitee.com/klguang/coderfun-boot 演示地址:http://106.15.195.9:8080/admin/项目文档:https://www.ka ...

  6. 170322、Spring Boot 性能优化之将Servlet容器变成Undertow

    需求缘起:在研究Spring Boot加速启动的时候,发现我们在实际中,可能比较注重我们服务器的内存的情况,那么我们会想如果在启动的时候,所占用的内存越低是越好,基于这个想法,我们看看Spring B ...

  7. 适配器模式(Adpater)

    一.适配器模式介绍 适配器模式:将一个类的接口转换成客户希望的另外一个接口.Adapter模式使得原本由于接口不兼容而不能一起工作的类可以一起工作. 例如: NBA中的球员来自不同国家,而世界标准语言 ...

  8. The Model represents your data structures.

    w模型代表数据结构. https://www.codeigniter.com/userguide3/overview/mvc.html http://codeigniter.org.cn/user_g ...

  9. Flume简介及使用

    一.Flume概述 1)官网地址 http://flume.apache.org/ 2)日志采集工具 Flume是一种分布式,可靠且可用的服务,用于有效地收集,聚合和移动大量日志数据.它具有基于流数据 ...

  10. 【题解】P5151 HKE与他的小朋友

    [题解]P5151 HKE与他的小朋友 实际上,位置的关系可以看做一组递推式,\(f(a_i)=f(a_j),f(a_j)=f(a_t),etc...\)那么我们可以压进一个矩阵里面. 考虑到这个矩阵 ...