无法定义用于 AJAX 的函数

Question

更新

经过社区的大量辛劳、麻烦和帮助后，以下链接显示了最简洁的代码版本。 http://jsfiddle.net/BPXMw/

================================================ ===========

嗯，我似乎很难理解队列的顺序以及它们如何围绕 AJAX 功能工作。

我目前正在处理以下脚本项目，但遇到了问题。 JSFiddle 上代码的直接链接是http://jsfiddle.net/gxAr5/15/

var shrunk = true;

function studies(caseNumber) {
    $.get("http://<? echo $_SERVER['HTTP_HOST']; ?>/includes/functions.php", {

        caseNumber: caseNumber

    }, function(data) {
        $(".expanded span").empty().html(data);
    });
}

function shrink(e) {
    e.stopPropagation();
    shrunk = false;
    $this = $("#grid li.expanded");

    $this.empty().stop().animate({
        height: '125px',
        left: $this.data('leftPos'),
        top: $this.data('topPos'),
        width: '114px'
    }, 2000, function() {
        shrunk = true;
        $this.css({
            'left': '0',
            'position': 'relative',
            'top': '0',
            'z-index': '0'
        });
        $("#grid li").removeAttr("style");
    });

    $("#grid li").removeAttr("class");
}

$("#grid li").click(function(e) {
    e.stopPropagation();

    if (shrunk) {
        shrunk = false;

        $(this).addClass("expanded").empty();

        var position = $(this).position();
        $(this).data('leftPos', position.left + 'px');
        $(this).data('topPos', position.top + 'px');

        $(this).css({
            'left': $(this).data('leftPos'),
            'top': $(this).data('topPos'),
            'position': 'absolute',
            'z-index': '2'
        });

        $(this).stop().animate({
            height: '403px',
            left: 0,
            top: 0,
            width: '370px'
        }, 2000, studies);
    }
});

$("html").click(function(e) { shrink(e); });

问题在于 $.get 事件执行但无法传递参数因此什么都不返回并且这样做了两次，一次是在动画开始时，一次是在结束时。

是否有任何善良的灵魂能够解释我应该在哪里定义“研究”以便参数通过？

Answer 1

您好，我认为问题出在此处

 ...
    }, 2000, function studies(caseNumber) {
$.get("http://<? echo $_SERVER['HTTP_HOST']; ?>/includes/functions.php", {
    caseNumber: caseNumber
}, function(data) {
    $(".expanded span").html(data);
});

当你应该引用它时，你正在声明该函数，首先定义该函数：

function studies() {
    $.get("http://<? echo $_SERVER['HTTP_HOST']; ?>/includes/functions.php", {

            caseNumber: caseNumber

        }, function(data) {
            $(".expanded span").html(data);
        });
}

然后在动画完成时调用它（当您只需要引用它时，您正在定义动画完成时的函数）：

 ...
    }, 2000, studies);

更新

在下面的cmets之后请找到更新jsfiddle http://jsfiddle.net/gxAr5/16/

这个版本你不应该让函数运行两次（我不确定你在复制代码时做错了什么）。

我也得到了 FUNCTION_NAME 未定义，因为您使用的是与 jQuery 混合的常规 javascript，而 jsfiddle 不允许我在 jquery 范围之外发布函数。因此，我也修改了 html，以便将文本“case1”、“case2”等作为 ID 传递，并且用于处理您点击 LI 元素的 javascript 在第 4 行完成：

$("#grid li").click(function(){

我还用服务器替换了 Google，这样我就可以得到一些输出，我可以看到可变案例编号正在传递给 google。

希望有帮助！

Answer 2

在您提出问题的代码中（我完全不确定它是否与您最初在小提琴中的代码相同），您的 studies 函数确实访问您在顶部声明的caseNumber var。但是您的代码中没有任何内容将caseNumber 设置为任何内容，因此它将具有其默认值undefined。因此，您的 $.get 调用将错过您要传递的 caseNumber 参数。

您没有理由收到studies 未使用您发布的代码定义的错误。