Question

我有以下jQuery调用，正确创建并在我的页面上加载DataTable。但是，这只适用于此脚本是HTML文件的一部分，因为我的sAjaxSource URL是使用模板替换值组成的：$ {company.name}。

当我将此代码移动到单独的.js文件时，它仍会运行并且创建 DataTable。但是，由于模板替换从不在include .js文件上运行，因此未设置sAjaxSource并且表未正确加载。

处理此问题的正确方法是什么？我是否必须在HTML文件本身中至少包含此javascript函数？

function() {
    $('#fund-contacts-table').dataTable( {bFilter: false,
                      bInfo: false,
                      bJQueryUI: true,
                      bPaginate: false,
                      bStateSave: false,
                      bSort: false,
                      bAutoWidth: false,
                      aoColumns: [ {"sTitle" : "Date", "sWidth" : "20%"}, {"sTitle" : "Our Team", "sWidth" : "20%"}, {"sTitle" : "Client Team", "sWidth" : "20%"}, {"sTitle" : "Note", "sWidth" : "40%"} ], 
                      sAjaxSource: "/contact/${company.name}/"} );
});

Answer 1

我想象模板替换是在HTML页面呈现时完成的。只要在模板呈现阶段将其设置为变量，就应该能够将其传递给DataTables初始化。

在加载外部.js之前

<script>
var contactSource = "/contact/${company.name}/";
</script>

然后在外部js中初始化：

sAjaxSource: contactSource;

Answer 2

到目前为止我的最佳答案（但我会留下问题，看看是否有人可以真正解决它）：

我没有在我的HTML中使用<script src=. . . />包含我的脚本文件，而是以这种方式包含它：

<script>
<%include file="../js/fund_page.js" />
</script>

其中%include是一个读取指定文件的Mako指令，对其执行模板处理，并将其包含在HTML文件中。它似乎是用于HTML片段，但也适用于此。

不幸的是，这意味着如果脚本文件没有更改，我将失去优化以不下载脚本文件。另一方面，这是一个问题的原因是脚本文件确实在页面之间发生了变化，因此这可能不会造成重大损失。

需要在外部javascript文件中替换DataTables Ajax源代码的模板

2 个答案: