问题

Question

问题

如何在向下拉<div id="content">时将其设为何处，它会执行一项功能，并在屏幕顶部显示“拉下来刷新”的div？

我知道iScroll会这样做，但它不能用于我正在尝试做的事情。它只适用于UL。

这是我的HTML

<div id="pullDown"> 
    <span class="pullDownIcon"></span><span class="pullDownLabel">Pull down to refresh...
    </span>
</div>
<div id="content">
    (There is a bunch of items that are loaded in via jquery and php, when you pull down to refresh, I want it to basically react that function.)
</div>

Answer 1

<script>
  $(function() {
    var refreshCallback = function(loader) {
      setTimeout(function(){
        //loader.finish();

      }, 1000);
    };

    var cancelRefreshing = function() {
    };

    $("#draggable").pulltorefresh({
      async: true,
      // event triggered when refreshing start
      refresh: function(event, finishCallback) {
        element = $(this)
        setTimeout(function(){
          alert("refresh");

          // you must call this function if refreshing process runs asynchronusly
          finishCallback();
        }, 1000);
      },
      abort: function() {
        alert("abort");
      }
    });
  });
  </script>

完整演示Click Here

Answer 2

您可以提供iScroll插件。

iScroll 4： http://cubiq.org/iscroll-4

Github Page： https://github.com/cubiq/iscroll

演示： http://cubiq.org/dropbox/iscroll4/examples/pull-to-refresh/

Answer 3

试试这个

$( "#pullDown" ).on( "dragstart", function( event, ui ) {} );

在函数内部你可以通过ajax调用来加载内容

$("#content").load("<something.php>");

这是整体

$( "#pullDown" ).on( "dragstart", function() {
    $("#content").load("<something.php>");
} );

下拉刷新（Div）

问题

3 个答案: