如何加载（）或获取（）html页面并将其保存在变量中？答案

【问题标题】：How can I load() or get() a html page and save it in a variable?如何加载（）或获取（）html页面并将其保存在变量中？
【发布时间】：2013-05-06 12:50:06
【问题描述】：

如何加载() 或获取() html 页面并将其保存在变量中？

我问这个问题是为了能够从 kendo.View 中的单独文件加载视图。所有剑道示例都解释了如何从字符串处理布局和视图：

var foo = new kendo.View("<span>Foo</span>");

这样使用字符串是不干净的。我希望能够做类似的事情：

var bar = new kendo.View(viewLoader.loadView("app/bar.html"));

有这样的想法

var viewLoader = (function ($, host) {
    //Loads external templates from path and injects in to page DOM
    return {
        //Method: loadExtTemplate
        //Params: (string) path: the relative path to a file that contains template definition(s)
        loadView: function (path) {
            //Use jQuery Ajax to fetch the template file
            var tmplLoader = $.ajax({
                url: path,
                async: false
            }).responseText;

            //tmplLoader.complete(function () {
            //    //Publish an event that indicates when a template is done loading
            //    $(host).trigger("TEMPLATE_LOADED", [path]);
            //});
        }
    };
})(jQuery, document);

这不起作用。为什么？如何简单地加载 html 页面并将其保存在 var 中以使用 jendo 视图？

【问题讨论】：

哪位不工作？

标签： javascript ajax jquery kendo-ui

【解决方案1】：

$.ajax() 返回一个 promise 对象，而不是 ajax 请求的结果。你需要注册一个回调方法来获取请求的结果，然后返回给调用者。

var viewLoader = (function ($, host) {
    //Loads external templates from path and injects in to page DOM
    return {
        //Method: loadExtTemplate
        //Params: (string) path: the relative path to a file that contains template definition(s)
        loadView: function (path) {
            var html;
            //Use jQuery Ajax to fetch the template file
            var tmplLoader = $.ajax({
                url: path,
                async: false
            }).done(function(result){
                html = result;
            });
            return html;
        }
    };
})(jQuery, document);

【讨论】：

谢谢。您的示例向我展示了我的错误的解释。

【解决方案2】：

您可以做的是将 HTML 内容作为响应发回。然后，您可以将整个 HTML 内容分配给一个变量。

var html = response;
var foo = new kendo.View(html);

【讨论】：