jQuery模板 - 替换DIV内容

时间:2011-02-03 17:59:15

标签: jquery asp.net-mvc templates

所以我正在使用jQuery模板,并在我的应用程序中使用以下代码:

@using (Html.BeginForm())
    {
        @Html.DropDownList("StateList",
                            Model.States,
                            "< Select >"
                            )

        <div id="designCenters"></div>

        <script id="designCenterTemplate" type="text/html">
            <p><li>${Name}</li></p>
        </script>           
    }

    <script language="javascript" type="text/javascript">
        $("#StateList").change(function () {
            $.getJSON("/api/designcentersbystate/" + $(this).val(), 
              function (data) { 
                  $("#designCenterTemplate").tmpl(data).appendTo("#designCenters")
               });
        });
    </script>

由于我在模板函数的回调函数参数中调用.appendTo,显然设计中心列表被添加到列表中。我的目标是使用模板化结果替换<div id="designCenters">中的内容。

寻找最有效的方法。

感谢。

2 个答案:

答案 0 :(得分:9)

更改成功功能如下:

function (data) { 
    $("#designCenters").html($("#designCenterTemplate").tmpl(data))
}

或者你可以每次都清空容器。

$("#designCenters").empty();
$("#designCenterTemplate").tmpl(data).appendTo("#designCenters");

答案 1 :(得分:1)

您可以在以下元素中替换html:

$("#designCenters").html(YOUR HTML HERE);