JQuery Изменить клонированную переменную (навсегда)

Question

Я знаю, что есть много вопросов по этому вопросу, однако ни один из них не помог мне в данном конкретном случае.

Я отправляю содержимое div в качестве параметра, используя ajax. Когда я говорю «содержимое», я имею в виду код html, который представляет собой таблицу с несколькими строками и столбцами. Этот код впоследствии сохраняется как файл html для создания файла PDF.

Пока все работает нормально. Моя проблема заключается в том, что перед тем, как отправить этот код html, мне нужно изменить значение sr c для 3 изображений, однако после слишком большого количества опций эти изменения никогда не вносятся.

Вот соответствующие код:

        var exportContents = $('#theResults').find("#reportContent").clone();

        //find the images which src need to be replaced
        $(exportContents).find('.dynImg').each(function(i, obj) {

        var saveAsName = new Date().valueOf() + ".png";

        saveAsName = "../tmpFiles/" + saveAsName;

        $( "input[name=elReporte]" ).val($(this).attr("src"));
        $( "input[name=theFileName]" ).val(saveAsName);
        var currentId = $(this).attr("id");
        theImgData = $("#justForPDFs").serialize();
        $.ajax({
            url: '../SaveImgServlet',
            type: 'GET',
            data: theImgData,
            success: function(data){
                $(exportContents).find("#" + currentId).attr("src", saveAsName);
                console.log($(exportContents).find("#" + currentId).attr("src"));

            },
            error: function (request, status, error) {
            alert(request.responseText);
        }
        });

В этих строках я изменяю нужные значения, а console.log показывает правильное значение:

$(exportContents).find("#" + currentId).attr("src", saveAsName);
alert($(exportContents).find("#" + currentId).attr("src"));

Однако, когда я передаю переменную "exportContents msgstr "(после всего этого) этих изменений нет, sr c всех этих 3-х изображений остается прежним, даже если console.log сказал иначе. Кажется, что переменная "exportContents" остается неизменной. Есть ли другой способ изменить эту переменную (навсегда)?

Кстати, хотя это не имеет значения для моего вопроса, то, что делает вызов ajax, представляет URL-адреса / имена изображений ( потому что они были созданы на лету и не «существуют») сервлету, который создаст реальное изображение и сохранит его. Все это прекрасно работает.

Наконец, после всего этого, переменная "exportContents" представляется следующим образом:

$( "input[name=elReporte]" ).val(exportContents.html());
theData = $("#justForPDFs").serialize();
$.ajax({
.
.//it does more stuff
.
.

Любая помощь будет по достоинству оценена.

Answer 1

Попробуйте async:false в ваших ajax запросах:

$.ajax({
            url: '../SaveImgServlet',
            type: 'GET',
            async: false,
            data: theImgData,
            success: function(data){
                $(exportContents).find("#" + currentId).attr("src", saveAsName);
                console.log($(exportContents).find("#" + currentId).attr("src"));

            },
            error: function (request, status, error) {
            alert(request.responseText);
        }
        });

Это приведет к завершению ajax запроса перед отправкой другого (поскольку все это происходит в al oop).

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