点击更改课程

Question

我想首先点击添加课程up，第二次点击添加课程down，第三次点击删除所有课程。

这是我的代码，但是类没有以相应的顺序应用：

function initAdClass() {
    var trigger =   '.post-info h2';
    jQuery(trigger).click(function(e) { 
        if ( jQuery(this).not('.up') && jQuery(this).not('.down') ) {
            jQuery(this).addClass('up');
        }
        else if ( jQuery(this).is('.up') && jQuery(this).not('.down') ) {
            jQuery(this).removeClass('up').addClass('down');
        }
        else if ( jQuery(this).not('.up') && jQuery(this).is('.down') ) {
            jQuery(this).removeClass('down');
        }           
    });
}

Answer 1

试试这个代码段。

＆＃13;

＆＃13;

var clicks=0;
$('a').click(function(){
  
  clicks = !isNaN($(this).attr('id')) ? $(this).attr('id') + 1 : 0; 
  if(clicks == 1)
  {
    $(this).addClass('Up').html('Up added');  
  } 
  if(clicks == 2)
  {
    $(this).removeClass('Up').addClass('Down').html('Up removed and Down Added');  
  } 
  if(clicks == 3)
  {
    $(this).removeClass().html('All removed');
    clicks=0;
  }
  $(this).attr('id', clicks);
  $(this).append(" " + clicks);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="javascript:void(0)">Trigger : 1 : </a>

<br/><br/>

<a href="javascript:void(0)">Trigger : 2 : </a>

<br/><br/>

<a href="javascript:void(0)">Trigger : 3 : </a>

＆＃13;

＆＃13;

＆＃13;