在页面加载时使用AJAX调用时javascript绑定不起作用

时间:2015-01-17 04:18:39

标签: javascript jquery html ajax ractivejs

首先让我告诉你我加载网页的过程。

1:假设页面被重定向到名为“X”的新页面

2:现在在$(document).ready(function(){})里面;我已经进行了一次AJAX调用,以获取将在页面中显示的所有数据。

3:数据出现后,我正在使用Ractive渲染AJAX返回的JSON数据,因为我已经将页面“X”分区为不同的模板。 这是相同的代码..

var tutorialRactive = null;
responseData = null;

$(document).ready(function() {
    responseData = {};
    responseData.isLoading = true;
    populateData();
    $.ajax({
        url : "/steplearners/tutorial",
        type : "GET",
        context : document.body,
        dataType : "json"
    }).done(function(data) {
        updateData(data);
        $.getScript("js/prism.js");
        console.log('Done');
    });
});

function populateData() {

    function templateEngine(holder, templateId, jsonResponse) {

        var ractive = new Ractive({
            // The `el` option can be a node, an ID, or a CSS selector.
            el : holder,
            // We could pass in a string, but for the sake of convenience
            // we're passing the ID of the <script> tag above.
            template : templateId,

            // Here, we're passing in some initial data
            data : {
                responseData : jsonResponse
            }
        });

        return ractive;
    }

    tutorialRactive = templateEngine('tutorialsContainer',
            '#tutorialTemplate', responseData);
}

function updateData(data) {
    data.isLoading = false;
    tutorialRactive.set('responseData', data);
}

问题陈述: 因为我在主页面中使用了导入的几个javascript文件,如“prism.js”。我写了一些DOM操作代码。这需要在页面加载时绑定,而“prism.js”正在加载。但到那时,模板可能无法呈现,因为它取决于所做的AJAX调用。因此模板内的组件没有正确绑定。

在这种情况下需要做些什么。当AJAX调用返回时,有没有办法对特定的javascript文件进行绑定。

提前完成

0 个答案:

没有答案