jQuery Templates Plugin 在编译前移除外部 div 标签答案

【问题标题】：jQuery Templates Plugin removes outer div tags before compilingjQuery Templates Plugin 在编译前移除外部 div 标签
【发布时间】：2012-05-17 09:48:13
【问题描述】：

我正在使用 jQuery 模板插件将单独的 html 文件呈现为模板。我的一个模板如下所示：

<div class="row">
    <div class="span4">
        test1
    </div>
    <div class="span4">
        test2
    </div>
    <div class="span4">
       test3
    </div>
</div>

出于测试目的，我实际上还没有渲染任何数据。

当我使用 firebug 进行调试时，我可以看到我的 ajax 调用获取了正确的 html（如上所示）。然后我使用一个 json 对象（存储在一个名为 data 的 var 中）来填充我检索到的模板（存储在一个名为 template 的 var 中），如下所示：

$.tmpl(template, data).appendTo('#person-item-placeholder');

生成的 html（由 firebug 检查）是这样的（注意缺少的 div 元素）

<div id="person-item-placeholder">
    <div class="span4">test1‌</div>
    <div class="span4">‌test2‌</div>
    <div class="span4">test3‌</div>
</div>

如何防止模板插件删除该元素？

【问题讨论】：

标签： jquery html templates jquery-templates

【解决方案1】：

jQuery.tmpl 文档在这方面有点模糊

从表面上看，您尝试过的应该可以，但模板参数选项之一显示为：

模板参数可以是……一个 HTML 元素（或 jQuery 对象包装一个元素），其内容将用作模板。

这里的关键词是“内容”，换句话说，包装器被丢弃了，尽管它并没有说在传递字符串时会发生这种情况。忽略这一点，症状与问题中描述的完全一样。

一种可能的解决方案是将模板预先包装在一个虚拟容器中，例如一个 div。

如果我是对的，那么这应该可以：

$.tmpl('<div>+'template+'</div>', data).appendTo('#person-item-placeholder');

或者也许：

$.tmpl($(template).wrap('<div/>'), data).appendTo('#person-item-placeholder');

【讨论】：

是的，但无论如何这都是一个严重的问题！谢谢！

【解决方案2】：

请浏览jquery template doc这个页面上的例子，你错过了其他的东西......

还要检查是否有任何丢失的标签...这一定是导致它的原因...其他一切似乎都很好...仍然与示例进行交叉检查

【讨论】：