admin管理员组

文章数量:1398983

I am using this PullToRefresh plugin:

.js#api

It works well but I have a popup on my page with div inline scroll. The problem is that when I want to scroll up (in the div) the PullToRefresh is triggered. Is it possible to "delete" or to temporarily disable the PullToRefresh when my popup is opened?

PullToRefresh.init({
    mainElement: 'body',
    onRefresh: function(){
        refreshAll();
    }
});

edit: delete PullToRefresh; // does not work

edit2: .js/blob/master/dist/pulltorefresh.js

I am using this PullToRefresh plugin:

https://github./BoxFactura/pulltorefresh.js#api

It works well but I have a popup on my page with div inline scroll. The problem is that when I want to scroll up (in the div) the PullToRefresh is triggered. Is it possible to "delete" or to temporarily disable the PullToRefresh when my popup is opened?

PullToRefresh.init({
    mainElement: 'body',
    onRefresh: function(){
        refreshAll();
    }
});

edit: delete PullToRefresh; // does not work

edit2: https://github./BoxFactura/pulltorefresh.js/blob/master/dist/pulltorefresh.js

  • javascript
  • pull-to-refresh
Share Improve this question edited Aug 10, 2017 at 0:34 liam 2,0143 gold badges23 silver badges28 bronze badges asked Jul 31, 2017 at 23:43 PeterPeter 11.9k31 gold badges101 silver badges155 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 8 +250

PullToRefresh.init() will return an object with a destroy() function as callback: https://github./BoxFactura/pulltorefresh.js/blob/master/dist/pulltorefresh.js#L326

var refresher = PullToRefresh.init({
    mainElement: 'body',
    onRefresh: function(){
        refreshAll();
    }
});

// destroy the PullToRefresh EventListeners when you open your popup
refresher.destroy()

There's also an open Github issue about improving the way to destroy this library after initialization: https://github./BoxFactura/pulltorefresh.js/issues/22

IMO there are two reasonable ways to do this.

You can define a triggerElement and put your overlay outside of this triggerElement:

PullToRefresh.init({
    mainElement: 'body',
    triggerElement: '#mainContent',
    onRefresh: refreshAll
});

with a markup somewhat like this

<body>
    <div id="containerForOverlays"></div>
    <div id="mainContent"></div>
</body>

that way, everything inside of #containerForOverlays won't trigger a refresh.

Or you could use the new hook shouldPullToRefresh() if your version already supports it.

An example where PullToRefresh depends on a checkbox to be checked

<label><input id="refresh" type="checkbox"> Pull to Refresh?</label>

using it like

PullToRefresh.init({
    mainElement: 'body',
    shouldPullToRefresh: function(){
        return document.getElementById('pullToRefresh').checked
    },
    onRefresh: refreshAll
});

Of course I'm not suggesting that you use a checkbox in your production code. I just wanted to show how you could dynamically "turn PullToRefresh on and off". In this example, depending on the checkbox to be checked.

It's up to you to implement the correct shouldPullToRefresh() for your application to determine wether PullToRefresh should be active or not.

本文标签： javascriptpulltorefreshjsDisable temporarilyStack Overflow

版权声明：本文标题：javascript - pulltorefresh.js - Disable temporarily - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744205352a2595159.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。