Question

我有一个主模板，如：

<script type="text/x-jQuery-tmpl" id="baseTmpl">
<tr>
    <td>${Name}</td>
    <td>
        <div id="${ID}">
            {{tmpl "#displayTmpl"}}
        </div>
    </td>
</tr>
</script>  

<script type="text/x-jQuery-tmpl" id="displayTmpl">
    <a id="myLink" href="javascript:changeTmpl(${ID})">${Department}</a>
</script>

<script type="text/x-jQuery-tmpl" id="editTmpl">
    <input type="text" id="text" value="${Department}" />
</script>

<script type="text/javascript">
    function changeTmpl(id) {
        var templateItem = $('#'+id).tmplItem();    
        templateItem.tmpl = editTemplate;
        templateItem.update();
    };
</script>

上面的代码也删除了所有tr数据，当我更新模板时。我想更新div的内容而不是完整的tr

Answer 1

在基本模板中，ID应该引用tr，而不是div

<tr div id="${ID}">
....
</tr>

目前，当你选择var templateItem = $（'＃'+ id）.tmplItem（）;时，它只会拉出div，因为这就是id引用的内容。

Answer 2

执行此操作时：

var templateItem = $('#'+id).tmplItem();

你得到了div的tmplItem，它实际上是该模板呈现的所有内容的tmplItem（整个<tr>）。

您想要访问div中元素的tmplItem。这可行：

var templateItem = $('#'+id).children(":first").tmplItem();

更新子模板

2 个答案: