Jquery滑动以进入下一页

Jquery swip to proceed to next page

本文关键字:一页 Jquery      更新时间:2023-09-26

我使用此功能在我的网站上启用滑动导航。

现在它需要读取并继续使用类"next"的 url

<li class="next"><a href="/webcams/tirol/2/a/b">Next</a></li>

在这里,我需要你帮助来创建它。

$(function () {
  $(document).on('mousedown', 'div', function (e) {
    var ref = arguments.callee;
    var handle = $(this);
    var startX = e.clientX;
    var startY = e.clientY;
    handle.off('mousedown', ref);
    handle.on('mouseup', function(e) {
      handle.off('mouseup', argument.call);
      handle.on('mousedown', ref);
      var endX = e.clientX;
      var endY = e.clientY;
      var distanceX = Math.(endX - startX);
      var distanceY = Math.(endY - startY);
      if (distanceX > 50) {
        handle.trigger((endX > startX) ? 'swipeRight' : 'swipeLeft');
      }
      if (distanceY > 50) {
        handle.trigger((endY < startY) ? 'swipeDown' : 'swipeUp');
      }
      e.preventDefault();
      return false;
    });
  });
  $(document).on('swipeRight', 'div', function(e) {
  });
  $(document).on('swipeLeft', 'div', function(e) {
  });
  $(document).on('swipeUp',  'div', function(e) {
  });
  $(document).on('swipeDown',  'div', function(e) {
  });
});

swipeRight回调中执行以下操作:

window.location = $(".next a").attr("href")

首先,此代码获取具有 a 子级的 .next 类的元素,然后使用 .attr() 函数获取 href 属性,并将浏览器重定向到 href 的值。

您可以只查询锚标记 (a),它是具有 class next 的列表的直接子级:

$(document).ready(function() {             
  console.log($('li.next > a').prop('href'));      
});

Working fiddle:http://jsbin.com/ibIGoma/6/edit