javascript - jQuery 模板未正确绑定(bind)

Question

考虑以下 html:

<table>
    <thead>(something here)</thead>
    <div id="templateContainer"></div>
    <tfoot>(something here)</tfoot>
</table>

我有适当的 jquery JSON 代码将模板正确绑定(bind)到 #templateContainer 中，并且数据也成功绑定(bind)。但问题是，绑定(bind)数据后，#templateContainer 似乎没有出现在它应该在的位置，事实上它是(在开发工具中):

<div id="templateContainer"></div>
<table>
    <thead>(something here)</thead>
    <tfoot>(something here)</tfoot>
</table>

我可以知道是什么原因导致上述模板错位吗？谢谢

编辑

<script type="text/javascript">
    function filterList() {
        var filter = 25;
        PageMethods.getList(filter, OnSuccessFilter);
    }

    function OnSuccessFilter(data) {
        BindTemplate(data[0]);
    }

    function BindTemplate(data) {
        $.get('/UserControls/User/template.htm', function (template) {
            $('#templateContainer').empty();
            data = eval('(' + data + ')');
            jQuery(template).tmpl(data).appendTo('#templateContainer');
        });
    }
</script>

Answer 1

您不能输入 <div>里面 <table>那样。 <div>如您所见，将显示在表格之外。这是因为语法不正确。

您必须将包装器 ( <div id="templateContainer"></div> ) 替换为 <tr>'s和<td>'s所以这将是一个可接受的 HTML 表格。