JQuery 修改一个克隆的变量（永远）答案

【问题标题】：JQuery Modify a cloned variable (for good)JQuery 修改一个克隆的变量（永远）
【发布时间】：2020-03-26 05:13:46
【问题描述】：

我知道关于这个主题有很多问题，但是，在这个特殊情况下，没有一个对我有用。

我正在使用 ajax 将 div 的内容作为参数发送。当我说“内容”时，我指的是 html 代码，它基本上是一个包含一些行和列的表格。此代码随后保存为 html 文件，以便生成 PDF 文件。

到目前为止一切正常。我的问题是，在我提交这个html代码之前，我需要更改3张图片的src值，但是，在尝试了太多选项之后，这些更改都没有进行。

以下是相关代码：

        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”（毕竟）时，这些更改不存在，所有这 3 个图像的 src 保持不变，即使 console.log 另有说明。似乎“exportContents”变量保持不变。有没有其他方法可以修改这个变量（永远）？

顺便说一句，虽然它与我的问题无关，但 ajax 调用的作用是将图像 url/名称（因为它们是动态生成的并且不“存在”）提交给一个 servlet将创建一个实际图像并保存它。所有这一切都很好。

最后，变量“exportContents”是这样提交的：

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

任何帮助将不胜感激。

【问题讨论】：

尝试将async:false 放入您的ajax 请求中。循环中的异步调用通常会搞砸。尝试在发送另一个请求之前等待单个请求的完成
哇！！非常感谢！！！！，这确实成功了！您能否将您的评论发布为答案，以便我将其标记为正确答案？
很高兴它有帮助，发布了答案..:)

标签： jquery servlets

【解决方案1】：

在您的 ajax 请求中尝试async:false：

$.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 请求之前完成（因为这一切都发生在一个循环中）。

希望这会有所帮助。

【讨论】：