动态加载的javascript不'；不工作第二次加载

我正在制作一个网页，它使用jQueryUI对话框（在模式模式下）来显示使用Django动态生成的表单。基本流程是：

• 用户单击一个按钮
• jquery（使用AJAX）发出get请求，返回表单的html，然后用于填充对话框
  • html包含一个脚本标记，用于处理表单上的一些UI，这些UI可以正常加载并按预期工作
• 然后，用户填写表单并单击“完成”，表单即被提交

当用户在表单上出错时，就会出现问题。服务器响应post请求（提交表单），修改原始表单（包括脚本）以显示错误。第二次加载脚本时，它会得到一个“未捕获引用错误：$is not defined（匿名函数）”该脚本与之前正常运行时完全相同。在整个过程中，页面永远不会刷新

下面是处理模式的javascript要点：

var add_container = $("#add_container");

add_container.dialog({...})

function show_form(form,response_func) {
    add_container.html(form);
    add_container.dialog("open");
    $("#add_form").submit(function (event) {
        return submit_form($(this),response_func);
    });
}

function submit_form(form,response_func) {
    add_container.append('<p>Adding...</p>');
    //this is a trick to upload a file without reloading the page
    form.attr('target','upload_target');
    $('#upload_target').load(function() {
        var response = $('#upload_target').contents().find('body').html();
        add_container.dialog("close");

        resp_obj = $(response)
        if (resp_obj.is('form')) {
            //***this is what reloads the form when there is an error
            show_form(response,response_func);
        } else {
            response_func(resp_obj);
        }

    });
}

$('#add_link').click(add_link);
function add_link() {
    $.get('/add_link', function(data) {
        function add_response(response) {
            //handle successful submission
        }
        show_form(data,add_response);
    });
}

//...more stuff that is not important

var add_container=$（“#add_container”）；
添加容器对话框（{…}）
函数显示形式（形式、响应形式）{
添加_container.html（表单）；
添加容器对话框（“打开”）；
$（“#添加表格”）。提交（功能（事件）{
返回提交表格（$（此），响应函数）；
});
}
函数提交表单（表单、响应函数）{
add_container.append（“添加…”
”）；
//这是一个在不重新加载页面的情况下上载文件的技巧
form.attr（'target'，'upload_target'）；
$（“#上传_目标”）.load（函数（）{
var response=$（'#upload_target'）.contents（）.find（'body'）.html（）；
添加容器对话框（“关闭”）；
resp_obj=$（响应）
if（resp_obj.is（‘形式’））{
//***这就是在出现错误时重新加载表单的方法
显示表单（响应、响应函数）；
}否则{
响应函数（resp_obj）；
}
});
}
$（“#添加链接”）。单击（添加链接）；
函数add_link（）{
$.get（'/add_link'，函数（数据）{
函数添加\ U响应（响应）{
//处理成功的提交
}
显示表单（数据、添加响应）；
});
}
//…更多不重要的东西

这是从/add_链接返回的html的要点

<script type="text/javascript" src="/scripts/add_form.js" ></script>
<form id="add_form" enctype="multipart/form-data" action="/add_link/" method="post">
<!-- Dynamically generated form here !-->
</form>

add_form.js是一个使用jQuery的标准javascript文件。它以$（document）.ready（函数（）{…}）开头，第一个$是发生ReferenceError的地方

---

表单需要根据单击的内容动态生成，因此我不能将所有内容都静态地放在页面上。脚本不是动态生成的，因此不一定需要动态加载，但我不确定如何将其保存在自己的文件中，并且仅在加载表单时才让其运行。我愿意接受实现相同效果的其他方法的建议。

您的表单操作指向与包含jQuery框架脚本的表单操作不同的相对路径，等等

<script type="text/javascript" src="/scripts/add_form.js" ></script>
<!-- src="/scripts" -->

<form id="add_form" enctype="multipart/form-data" action="/add_link/" method="post">
<!-- action="/add_link" -->

---

为了确保在表单提交后加载框架，只需在浏览器上使用类似于开发人员工具的工具，并检查jQuery脚本src的head标记。它还在吗？

多亏了MelanciaUK，我意识到当我将表单提交到iFrame时，响应首先被发送到那里，脚本将在那里运行并出错，因为iFrame被视为自己的页面，无法访问主页上加载的jQuery

我决定通过消除add_表单脚本的动态加载来解决这个问题，并在页面加载时像其他脚本一样加载它。我创建了一个自定义jQuery事件（使用），以便仅在打开add表单时运行脚本。这正是我想要的

---

希望这能帮助任何有类似问题的人。如果您有任何问题，请随时提问

我仔细检查了一下，jQuery脚本在表单提交后肯定还在那里。我看到了脚本，也可以在控制台中键入“$”，它不会给出错误。这是有道理的，因为没有页面刷新。但是你的回答让我想到了一个主意。脚本是否可以在表单提交到的iFrame中执行，因为响应会返回到iFrame，然后主javascript会捕获它？如果是这样，我将如何防止这种情况？