mirror of
https://gitee.com/wangkang/udf.git
synced 2026-10-21 01:13:43 +00:00
更新下拉刷新逻辑
This commit is contained in:
+11
-10
@@ -233,7 +233,14 @@
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
{
|
||||
//微信禁止下拉
|
||||
this.wxStopPull();
|
||||
//初始化
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
//微信禁止下拉
|
||||
wxStopPull() {
|
||||
var startY = 0;
|
||||
document.addEventListener('touchstart', function (e) {
|
||||
startY = Number(e.touches[0].pageY);
|
||||
@@ -254,11 +261,7 @@
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
//初始化
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
},
|
||||
//开始拖拽
|
||||
touchStart(e) {
|
||||
//下拉刷新逻辑
|
||||
@@ -306,11 +309,9 @@
|
||||
{
|
||||
if (this.moveDistance > 70) {
|
||||
this.$EventBus.$emit(glob.eventNames.globRefreshEventName);
|
||||
this.moveDistance = 0;
|
||||
this.moveState = 0;
|
||||
} else {
|
||||
this.moveDistance = 0;
|
||||
}
|
||||
this.moveDistance = 0;
|
||||
this.moveState = 0;
|
||||
}
|
||||
},
|
||||
//初始化
|
||||
|
||||
@@ -309,6 +309,12 @@
|
||||
.pre-scrollable {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.loadDiv {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 2000;
|
||||
}
|
||||
</style>
|
||||
<title>[(${title})]</title>
|
||||
</head>
|
||||
@@ -377,8 +383,6 @@
|
||||
integrity="sha256-WqU1JavFxSAMcLP2WIOI+GB2zWmShMI82mTpLDcqFUg=" crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap-toasts-js@1.1.4/dist/js/bootstrap-toasts-js.min.js"
|
||||
integrity="sha256-8eA/hiFNtfHeSl0SbSynWCaqa6DeEzsLD1lxsS8JnzM=" crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/pulltorefreshjs@0.1.20/dist/index.umd.min.js"
|
||||
integrity="sha256-plfyATLvpJutooJZODIP/uMaXvn8TK229Xa2FVMP/Ks=" crossorigin="anonymous"></script>
|
||||
<script type="text/javascript">
|
||||
//页面加载完成
|
||||
$(document).ready(function () {
|
||||
@@ -430,15 +434,89 @@
|
||||
});
|
||||
//下拉刷新
|
||||
$(function () {
|
||||
PullToRefresh.init({
|
||||
mainElement: 'body',
|
||||
instructionsReleaseToRefresh: '<i class="fa fa-arrow-up btnTop-custom-fa" aria-hidden="true">',
|
||||
instructionsRefreshing: '刷新中',
|
||||
onRefresh: function () {
|
||||
openLoading();
|
||||
window.location.reload();
|
||||
}
|
||||
});
|
||||
//下拉刷新
|
||||
{
|
||||
var moveDistance = 0;
|
||||
var startY = 0;
|
||||
var moveState = 0;
|
||||
$('.main').on('touchstart', function () {
|
||||
moveDistance = 0;
|
||||
startY = 0;
|
||||
$('.loadDiv').remove();
|
||||
});
|
||||
$('.main').on('touchmove', function (e) {
|
||||
var scrollTop = document.getElementsByClassName('pre-scrollable')[0].scrollTop;
|
||||
if (scrollTop > 0) {
|
||||
return;
|
||||
} else {
|
||||
if (startY === 0) {
|
||||
startY = e.targetTouches[0].clientY;
|
||||
}
|
||||
}
|
||||
console.log(e.targetTouches[0].clientY, window.innerHeight);
|
||||
var y = e.targetTouches[0].clientY > window.innerHeight ? window.innerHeight : e.targetTouches[0].clientY;
|
||||
var move = y - startY;
|
||||
if (move > 0) {
|
||||
moveDistance = Math.pow(move, 0.8);
|
||||
var loadDivDoms = document.getElementsByClassName('loadDiv');
|
||||
if (loadDivDoms && loadDivDoms[0]) {
|
||||
loadDivDoms[0].style.transform = "translate3d(0," + (moveDistance > 70 ? 70 : parseInt(moveDistance)) + 'px' + ",0)";
|
||||
} else {
|
||||
$('body').prepend(
|
||||
'<div class="loadDiv">' +
|
||||
' <div class="text-center">' +
|
||||
' <div class="spinner-grow text-success" role="status">' +
|
||||
' <span class="sr-only">Loading...</span>' +
|
||||
' </div>' +
|
||||
' </div>' +
|
||||
'</div>'
|
||||
);
|
||||
}
|
||||
if (moveDistance > 70) {
|
||||
if (moveState === 1) return;
|
||||
moveState = 1;
|
||||
} else {
|
||||
if (moveState === 0) return;
|
||||
moveState = 0;
|
||||
}
|
||||
} else {
|
||||
moveDistance = 0;
|
||||
moveState = 0;
|
||||
$('.loadDiv').remove();
|
||||
}
|
||||
});
|
||||
$('.main').on('touchend', function () {
|
||||
if (moveDistance > 70) {
|
||||
$('body').trigger('pullReload');
|
||||
}
|
||||
moveDistance = 0;
|
||||
moveState = 0;
|
||||
$('.loadDiv').remove();
|
||||
});
|
||||
}
|
||||
//微信禁止下拉
|
||||
{
|
||||
var startY = 0;
|
||||
document.addEventListener('touchstart', function (e) {
|
||||
startY = Number(e.touches[0].pageY);
|
||||
});
|
||||
var ele = document.querySelector('.pre-scrollable');
|
||||
ele.ontouchmove = function (e) {
|
||||
var scrollbarDom = document.getElementsByClassName('pre-scrollable')[0];
|
||||
var point = e.touches[0];
|
||||
var eleTop = scrollbarDom.scrollTop;
|
||||
var eleTouchBottom = scrollbarDom.scrollHeight - scrollbarDom.offsetHeight;
|
||||
if (eleTop === 0) {
|
||||
if (point.clientY > startY) {
|
||||
e.preventDefault();
|
||||
}
|
||||
} else if (eleTop === eleTouchBottom) {
|
||||
if (point.clientY < startY) {
|
||||
e.preventDefault()
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
});
|
||||
//注册按钮点击事件
|
||||
$('.header-right-bar-registered-div button').on('click', function () {
|
||||
|
||||
@@ -10,6 +10,41 @@
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
<h1 class="text-center">网站正在建设中</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -19,7 +54,11 @@
|
||||
<script type="text/javascript">
|
||||
//页面加载完成
|
||||
$(document).ready(function () {
|
||||
|
||||
//下拉刷新
|
||||
$('body').on('pullReload', function (e) {
|
||||
openLoading();
|
||||
window.location.reload();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -36,6 +36,11 @@
|
||||
<script type="text/javascript">
|
||||
//页面加载完成
|
||||
$(document).ready(function () {
|
||||
//下拉刷新
|
||||
$('body').on('pullReload', function (e) {
|
||||
openLoading();
|
||||
window.location.reload();
|
||||
});
|
||||
//注册按钮点击事件
|
||||
$('.registered-btn').on('click', function () {
|
||||
//跳转到注册
|
||||
|
||||
@@ -44,6 +44,11 @@
|
||||
<script type="text/javascript">
|
||||
//页面加载完成
|
||||
$(document).ready(function () {
|
||||
//下拉刷新
|
||||
$('body').on('pullReload', function (e) {
|
||||
openLoading();
|
||||
window.location.reload();
|
||||
});
|
||||
//登陆按钮点击事件
|
||||
$('.login-btn').on('click', function () {
|
||||
//跳转到登陆
|
||||
|
||||
Reference in New Issue
Block a user