我正在通过点击事件的 ajax 加载一些 html 内容。我的代码是-

$.ajax({
  url: somelink,
  async: true,
  beforeSend: function () {
      $("#myDiv").fadeOut("slow");
      $("#myDiv").empty();
  },
  success: function (data) {
      $('#myDiv').html(data);
      $("#myDiv").fadeIn("slow");
  },
  error: function (request, status, error) {
     alert("Error");
  },
  complete: function () {
  }
 });

问题是#myDiv 两次淡入淡出。这里有什么问题?

最佳答案

似乎与 html() 调用有关,该调用实际上非常快地显示了内容,然后在淡入淡出开始之前将其再次隐藏。如果内容未更新,淡入/淡出会按预期运行。

您可以在成功函数中使用 .hide() :

beforeSend: function () {
    $("#myDiv").fadeOut("slow").empty();
},
success: function (data) {
    $('#myDiv').hide().html("test!").fadeIn("slow");
},

关于JQuery 淡入()触发两次,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/21547352/

10-12 13:05