【问题标题】：stop jQuery button event on last slide在最后一张幻灯片上停止 jQuery 按钮事件
【发布时间】：2015-12-19 13:15:06
【问题描述】：

https://jsfiddle.net/z3q2wtLf/29/embedded/result/

在上面附加的 jsfiddle 链接中，.cd-hero 有 3 张幻灯片，可通过点击激活。我正在尝试仅在第三张幻灯片（“谢谢”）上向 jQuery 添加停止事件，以便用户在该幻灯片上停止（不会向右滑动或返回上一张幻灯片）。我是 jQuery 新手，非常感谢任何有关如何实现这一点的帮助！

我尝试过以下应用但没有成功：

$('.cd-btn').on('click', function(event) {
      event.preventDefault();
      if($(this).hasClass('.thanks')){
       event.stopPropagation();
      } else {
        var activePosition = $('.cd-hero-slider .selected').index();
        var selectedPosition =  activePosition + 1;
        nextSlide($('.cd-hero-slider'), $(''), selectedPosition);

        updateNavigationMarker(selectedPosition + 1);
      }
  });

【问题讨论】：

标签： javascript jquery html css

【解决方案1】：

试试这个：

HTML

<a href="" class="cd-btn" id="BtnThankyou">Thank you</a>

JS

$('.cd-btn').on('click', function(event) {
           if($(this)[0].id == "BtnThankyou"){

           return false;
           }

            event.preventDefault();
            var activePosition = $('.cd-hero-slider .selected').index();
            var selectedPosition =  activePosition + 1;
            nextSlide($('.cd-hero-slider'), $(''), selectedPosition);

          updateNavigationMarker(selectedPosition + 1);
           });

DEMO

【讨论】：

【解决方案2】：

通过将其他按钮的“显示”属性设置为“无”或使用 $(this).hide() 来添加一个删除其他按钮的按钮

【讨论】：

【解决方案3】：

将点击事件与按钮解除绑定。

$('.cd-btn').on('click', function(event) {
      event.preventDefault();
      if($(this).hasClass('.thanks')){
       $('body').unbind('click','.cd-btn'); // Unbind the click event
      } else {
        var activePosition = $('.cd-hero-slider .selected').index();
        var selectedPosition =  activePosition + 1;
        nextSlide($('.cd-hero-slider'), $(''), selectedPosition);

        updateNavigationMarker(selectedPosition + 1);
      }
  });

【讨论】：

【解决方案4】：

您可以在最后一个.cd-btn（谢谢按钮，例如.btn-thank-you）上再添加一个类，然后使用$('.cd-btn:not(.btn-thank-you)') 将其从点击事件中排除。

Jsfiddle

【讨论】：

【解决方案5】：

我刚刚更新了你的 jsFiddle，添加了一个简单的条件解决方案，如果项目“n”的数量等于长度，则不要触发事件。

function nextSlide(container, pagination, n) {

if(n != container.children('li').length){

var visibleSlide = container.find('.selected'),
  navigationDot = pagination.find('.selected');

visibleSlide.removeClass('selected from-left from-right').addClass('is-moving').one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function() {
  visibleSlide.removeClass('is-moving');
});

container.children('li').eq(n).addClass('selected from-right').prevAll().addClass('move-left');
navigationDot.removeClass('selected')
pagination.find('li').eq(n).addClass('selected');

checkVideo(visibleSlide, container, n);

}else{ //Thank You events }

}

https://jsfiddle.net/z3q2wtLf/35/

【讨论】：