jquery - 单击按钮并在 Chrome 和 Safari 中不顺利地更改图像

Question

我有一个带有许多按钮的界面，当单击按钮时，我使用 jquery 来切换按钮图像。像这样的东西：

$(".button").click(function() {
   $(".button").html("<img src="...">");
});

一切正常。在 Firefox 中，它会立即更改按钮，看起来非常漂亮。但是，在 Chrome 和 Safari 中，当您单击按钮时（或使用其他功能自动更新按钮，实际上非常相似的代码：.html("...")），按钮会闪烁，基本上是在交换图像时，出现那里是一片空白。

我能做些什么来解决这个问题吗？

谢谢

Answer 1

你可以做..

$(".button").click(function() {
  $(this).fadeOut(800,function(){
    $(this).text("<img src='img.jpeg'>");
    $(this).fadeIn(800);
  })
});