Question

我有写脚本从外部php文件加载内容。我正在使用jquery1-9-1。我的脚本工作正常，只有当我第二次点击按钮时。在动画开始之前有0.5秒的延迟。我想我知道问题是什么，它在哪里。 $("#header").animate({marginTop: "10px"...必须在第一次点击时执行。点击一次后，必须取消激活。谁知道如何解决呢？不要判断我这么严厉，对不起我的英语

$(document).ready(function () {
    var content = $("#content");
    $("#main_menu a").click(function () {
        var id = this.id;
        $("#header").animate({
            marginTop: "10px"
        }, 500, function () {
            $("#content").fadeOut(500, function () {
                $("#content").load(id + ".php")
                $("#content").fadeIn(500)
            })
        })
    })
})

Answer 1

我必须问一下，如果您拒绝使用缓存content = $("#content")，请稍后再次拨打$("#content")，这有什么意义？

无论如何，你需要一个变量来判断它是否是第一次运行：

    $(function () {
        var content = $("#content"), isfirst = true;
        $("#main_menu a").click(function () {
            var id = this.id,
                reveal = function() {
                    content.fadeOut(500, function () {
                        content.load(id + ".php")
                        content.fadeIn(500)
                    });
                };
            if( isfirst) $("#header").animate({marginTop: "10px"}, 500, reveal);
            else reveal();
            isfirst = false;
        });
    });

Answer 2

在这种情况下，您需要跟踪它是否已加载。一个简单的变量和一些闭包应该这样做：

var isLoaded = false;
$("#main_menu a").click(function () {
          var id = this.id;
          if (!isLoaded) {
              $("#header").animate({
                 marginTop: "10px"
              }, 500);
              isLoaded = true;
          }
          $("#content").fadeOut(500, function () {
          $("#content").load(id + ".php")
          $("#content").fadeIn(500)
       })
  });

动画以延迟开始

2 个答案: