jQuery 开关类未在 Chrome 中正确激活

Posted 2023-05-08

【中文标题】jQuery 开关类未在 Chrome 中正确激活

【英文标题】：jQuery switch class not activating in Chrome correctly

【发布时间】：2013-06-21 13:52:58

【问题描述】：

我正在我的网站上制作一个功能，它使用 jQuery 的 switch 类函数来为按钮设置动画。

您可以在http://www.minecraftserverland.com/testview.php查看页面

按钮在单击时从白色背景变为清晰背景，在第二次单击后返回白色背景。这在 Firefox 和 Internet Explorer 中完美运行，但在 google chrome 中，切换的类似乎无法正确呈现。

第二次单击时，按钮不会变清晰，实际上会变黑。但是，在任何时候，如果您检查元素，类会自行修复，因此 javascript 显然可以正常工作。

我正在使用的 jquery 示例：

$("#ftb").click(function () 
    if ( $("#ftb").hasClass("s1") ) 
        $('#ftb.s1').switchClass( "s1", "sd1", 700, "swing" );
        $('input#main').val('1');
     else if (  $("#ftb").hasClass("sd1") ) 
        $('#ftb').switchClass( "sd1", "s1", 700, "swing" );
        $('#bukkit').switchClass( "s1", "sd2", 700, "swing" );
        $('#vanilla').switchClass( "s1", "sd3", 700, "swing" );
        $('input#main').val('ftb');
    
);

有没有人遇到过这种情况？你知道为什么会这样吗？谢谢！

【问题讨论】：

我见过其他情况，Chrome 在动态更改类后呈现错误，然后在您检查时清除。我认为这是一个 Chrome 错误。

有解决办法吗？

你知道@wl4000吗？看起来他对同一段代码提出了不同的问题：***.com/questions/16138145/…

我以前见过几次，但我还没有找到解决方法。不幸的是，我找不到讨论它们的 SO 问题（您只能搜索问题和答案，而不是 cmets），所以我不知道其他人是否弄清楚了。

我知道他，我们实际上是合作伙伴。不幸的是，看起来没有人能解决这个问题......

【参考方案1】：

有同样的情况。

有趣的是，当您使用旧的 .removeclass().addclass() 事物时，chrome 会正常运行。每次都打字很烦，所以我做了一个简单的函数，没有任何回调或持续时间，希望对大家有帮助。

jQuery.fn.switcher = function(n,s) 
    var $elem = $(this[0]) ;
    $(this).removeClass(n).addClass(s);

    return $elem; //ensures jquery chainability
;

像这样工作：

$(element).switcher("removedclass","addedclass");