如何让这个JS代码更短？

Question

这里是我的代码：

$(function() { 
$('#fadeinright').waypoint(function(direction) { 
    if (direction === 'down') { 
     $(this).removeClass("fadeinright"); 
    } 
}); 
$('#fadeinleft').waypoint(function(direction) { 
    if (direction === 'down') { 
     $(this).removeClass("fadeinleft"); 
    } 
}); 
    $('#fadeintop').waypoint(function(direction) { 
    if (direction === 'down') { 
     $(this).removeClass("fadeintop"); 
    } 
}); 
$('#fadeinbottom').waypoint(function(direction) { 
    if (direction === 'down') { 
     $(this).removeClass("fadeinbottom"); 
    } 
}); 
$('#simplefadein').waypoint(function(direction) { 
    if (direction === 'down') { 
     $(this).removeClass("simplefadein"); 
    } 
}); 

是否有人知道如何使它更短？ 我即将添加更多的类，并且我不确定它是否正确执行代码。

这里有一个例子是如何工作的：https://jsfiddle.net/nbgdzspy/35/

Answer 1

我的变种

$('#fadeinright, #fadeinleft, #fadeintop, #fadeinbottom, #fadeinbig, #fadeinsmall').waypoint(function(direction) { 
     if (direction === 'down') { 
      $(this).removeClass($(this).attr('id')); 
     } 
}); 

Answer 2

这里有一种方法：

['fadeinright', 'fadeinleft', 'fadeintop', 'fadeinbottom', 'fadeinbig', 'fadeinsmall'].forEach(function (name) { 
    $('#' + name).waypoint(function (direction) { 
     if (direction === 'down') { 
      $(this).removeClass(name); 
     } 
    }, { 
     offset: '100%' 
    }); 
});