jQuery onClick 在主元素上不起作用答案

【问题标题】：jQuery onClick not working on the main elementjQuery onClick 在主元素上不起作用
【发布时间】：2015-09-10 11:59:17
【问题描述】：

我正在尝试从元素中添加和删除 onclick 类。

但我的函数不起作用，因为它仅在单击子元素时添加类，仅在单击父元素时删除该类。

我想移动.card-header.swipeable 元素以显示.swipe-actions 元素并再次单击以隐藏。

JS FIDDLE

jQuery(document).ready(function($){
  //slide the contact
  $('.card-header.swipeable').on('click', function(event){
    event.preventDefault();
    $(this).addClass('swipe-left');
  });
  //close the contact
  $('.card-header.swipeable').on('click', function(event){
    if( $(event.target).is('.card-header.swipeable') ) { 
      $('.card-header.swipeable').removeClass('swipe-left');
      event.preventDefault();
    }
  });
});

【问题讨论】：

标签： javascript jquery css onclick addclass

【解决方案1】：

检查此代码

$('.card-header.swipeable').on('click', function(e){
    e.preventDefault();

    if( $('.card-header.swipeable').hasClass('swipe-left') ) { 
      $('.card-header.swipeable').removeClass('swipe-left');
    }else{
        $(this).addClass('swipe-left');
    }

  });

【讨论】：

【解决方案2】：

您可以简单地使用toggleClass：

$('.card-header.swipeable').on('click', function(e) {
    $(this).toggleClass('swipe-left');
    e.preventDefault();
})

【讨论】：

哇，这太棒了！有没有办法让它翻译得慢一点？