Question

我遵循从服务器获取HTML模板并替换某些标签的功能

$.ajax({
    url: "/newsletter/preview/1",
    data: {},
    success: function(data) {
        var template = data;
        var layer = $("<iframe>").attr({ "id": "preview_frame" });
        $("#newsletter .element input, #newsletter .element textarea").each(function() {
            var id = "\\$\\$"+$(this).parent().parent().attr("id").replace(/^newsletter_/, "")+"\\$\\$";
            template = template.replace(new RegExp(id, "g"), htmlspecialchars($(this).val(),2));
        });
        $("body").prepend(layer);
    },
    dataType: "html"
});

获取模板正常。同时用表格内容替换标签（在alert(escape(template));循环中放置each时）会告诉我，所有标签都被替换了。但是还有两个未解决的问题：

我没有找到将变量template的内容设置为iframe的方法（$("#preview_frame").contents().find("body").html(template); 结果只在一个空框架中）
将iframe（变量layer）预先添加到HTML正文中在迭代表单字段期间，但必须在（！）之后完成所有标签都已被替换，因此只有完整处理的模板才会被放置在iframe内。

Answer 1

动态添加iframe，哪个来源是您的ajax调用网址，并在iframe页面的onload中执行javascript操作。

$("<iframe/>").attr({
   source: "/newsletter/preview/1",
   id: "preview_frame"
}).appendTo($("body"));

Answer 2

我正在使用http://malsup.com/jquery/form/的jQuery表单插件。所以我通过Ajax将表单发送到服务器，生成临时文件，成功发送表单后通过iframe包含。

在通过jQuery进行数据处理后替换iframe的内容

2 个答案: