Swiper onSlideClick - 获取单击的HTML元素

时间:2014-12-04 16:53:21

标签: javascript web swiper

这可能是解决问题的一种非常简单的方法......

我的(简体)HTML:

<div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <a id="user-link" href="#" data-user-id="47">..</a>
            <a id="post-link" href="#" data-post-id="8">..</a>
        </div>
    </div>
</div>

现在,我需要的是一种确定点击了哪个链接的简单方法,因此我可以重定向到不同的页面。不知怎的,用给定的&#34; onSlideClick&#34;它是不可能的。来自Swiper API的函数。

我一直在尝试这样的事情:

onSlideClick: function() {
    if ($(this).attr('id') == 'user-link') {
        var userId = $('a').data('user-id');
        $.redirect('user.php', { userId: userId });
    }
    if ($(this).attr('id') == 'post-link') {
        var postId = $('a').data('post-id');
        $.redirect('post.php', { postId: postId });
    }
}

问题:Firebug告诉我

onSlideClick: function() {
    console.log($(this).attr("id"));
}

未定义。

我必须通过JavaScript重定向,否则我的刷卡不会起作用,因为我会立即重定向。

1 个答案:

答案 0 :(得分:1)

您可以尝试从事件目标中获取点击元素:

onSlideClick: function(swiper, e) {
  var clicked = $(e.target);
  var id = clicked.attr('id');
  if (id == 'user-link') {
    var userId = clicked.data('user-id');
    $.redirect('user.php', { userId: userId });
  }
  if (id == 'post-link') {
    var postId = clicked.data('post-id');
    $.redirect('post.php', { postId: postId });
  }
}