Question

此javascript使用变量中的值（名为physical_location）填充SelectField。当Javascript直接插入模板时，它可以工作：

<th> Format {{ form.physical_location(class_='form-control physical_location', value=physical_location) }} </th>

<script> var els = document.getElementsByClassName("physical_location");
    for (i = 0; i < els.length; i++) {
        els[i].value = els[i].getAttribute('value');
}
</script>

但是，当我尝试整理并将其放在单独的文件中时，它不像以前那样工作。例如，我在模板文件中尝试了这个：

<script src="static/js/populateselect.js" type="text/javascript"></script>

<th> Format {{ form.physical_location(class_='form-control physical_location', value=physical_location) }} </th>

这是populateselect.js：

var els = document.getElementsByClassName("physical_location");
    for (i = 0; i < els.length; i++) {
        els[i].value = els[i].getAttribute('value');
}

编辑**答案中建议我的问题与我将src放在模板上方的表格有关。结果我修改了模板谎言：

<th> Physical Location {{ form.physical_location(class_='form-control physical_location', value=physical_location) }} </th>
<script src="static/js/populateselect.js" type="text/javascript"></script>

但是，这还没有解决问题。我一定做了别的错事（？）

Answer 1

您的代码示例之间存在两个差异：

脚本是内联的或来自网址
该脚本位于尝试使用DOM或

你选择了错误的两个来指责你的问题。

You can't access DOM elements before they exist

直接在模板中键入时，Javascript有效，但从src文件导入时则无效

1 个答案: