Проблемы с определением функции для использования в AJAX

Question

UPDATE

После многих трудов, неприятностей и помощи сообщества по следующей ссылке показана самая лучшая версия кода. 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);

ОБНОВЛЕНИЕ

После комментариев ниже найдите обновлениеjsfiddle http://jsfiddle.net/gxAr5/16/

В этой версии вы не должны запускать функцию дважды (я не уверен, что вы делали неправильно, когда копировали код).

Я также получал FUNCTION_NAMEundefined, так как вы использовали обычный javascript, смешанный с jQuery, и jsfiddle не позволили мне публиковать функции вне области jquery.Поэтому я также изменил html так, чтобы текст "case1", "case2" и т. Д. Передавался в качестве идентификатора, а javascript для обработки ваших нажатий на элементы LI выполняется в 4-й строке:

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

Я также заменил сервер на Google, чтобы получить вывод и увидеть, что переменный номер дела передается в Google.

Надеюсь, это поможет!

Answer 2

В коде, который вы задали в вопросе (который я совсем не уверен, совпадает с кодом, который был у вас в скрипте), ваша studies функция имеет доступ на caseNumber переменную, которую вы объявили сверху. Но ничто в вашем коде ничего не устанавливает в caseNumber, поэтому его значение по умолчанию будет undefined. Поэтому при вызове $.get будет пропущен параметр caseNumber, который вы собираетесь передавать.

Нет причины, по которой вы должны получить ошибку, что studies не определен с кодом, который вы опубликовали.