javascript - 让toggleClass淡入但不淡出

Question

我目前正在使用 jQuery 的 toggleClass() 方法，我想让该类淡入，但我不希望它淡出。我一直在使用“duration”属性，但考虑到它是toggleClass，两种方式的持续时间是相同的。我不想使用带有淡入功能的 addClass() 和不带淡出功能的 removeClass() ，因为我觉得代码会变得太长且难以驾驭。我想要小、简单、可读的代码。

有什么想法吗？

到目前为止我有这个:

$("#e" ).hover(function() {
    $(this).closest("#word").toggleClass("hoverE", 500 )
});

我想要这样的东西，我可以在其中指定淡入持续时间和淡出持续时间:

$("#e" ).hover(function() {
    $(this).closest("#word").toggleClass("hoverE", 500, 0 )
});

我已经尝试过类似的方法，但它不起作用:

$("#e" ).hover(function() {
    $(this).closest("#word").toggleClass("hoverE").fadeIn(500)
});

HTML:

  <div id="word">
    <h1><a id="h" class= "letter" href=#>H</a></h1>
    <h1><a id="e" class= "letter" href=#>E</a></h1>
    <h1><a id="l" class= "letter" href=#>L</a></h1>
    <h1><a id="l2"class= "letter" href=#>L</a></h1>
    <h1><a id="o" class= "letter" href=#>O</a></h1>
  </div>

Answer 1

这个不存在。您可以创建自己的:

$.fn.myToggleClass = function(className, showDur, hideDur) {
    if(this.hasClass(className)){
        this.removeClass(className, hideDur);   
    } else {
        this.addClass(className, showDur);
    }
};

http://jsfiddle.net/6QqYQ/