jsrender简单例子-蒲公英云

jsrender简单例子

矫情吗；* 2022-08-27 10:57 250阅读 0赞

<div id="tabContent"></div>
<script type="text/javascript" src="${ rootpath}/res/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="${ rootpath}/res/js/jsrender.min.js"></script>
<script type="text/x-jsrender" id="tablist">
    <table cellspacing="0" cellpadding="0" width="100%" border="1">
        <tr style="height:30px;background-color: #6293bb;">
            <th>主题</th>
            <th>回复</th>
            <th>作者</th>
            <th>阅读</th>
            <th>更新时间</th>
        </tr>
        {
   {for topicList}}
            <tr>
                <td align="left" style="padding-left:5px;">
                    {
   {if pstatus == '1'}}
                        <img src="${rootpath}/res/images/read_topic.gif" />
                    {
   {else}}
                        <img src="${rootpath}/res/images/unread_topic.gif" />
                    {
   {/if}}                    
                    <a href="#" style="padding-left:5px;">{
   {:title }}</a>
                </td>
                <td>{
   {:reply }}</td>
                <td>{
   {:username }}</td>
                <td>{
   {:readcount }}</td>
                <td>{
   {:pdate }}</td>
            </tr>
        {
   {/for}}
    </table>    
</script>
<script type="text/javascript">
jQuery.post("${rootpath}/topic/list.action",{},
    function(data, textStatus, jqXHR)
    {
        var tabCon = $("#tablist").render(data);
        $("#tabContent").html(tabCon);
    },
"json");
</script>

后台逻辑：

@RequestMapping(value="/list", method=RequestMethod.POST)
    public void indexForList(HttpServletRequest request, HttpServletResponse response) throws IOException
    {
        List<Topic> list = topicService.queryTopicList();
        response.setContentType("application/json;charset=UTF-8");
        Map<String, List<Topic>> map = new HashMap<>();
        map.put("topicList", list);
        response.getWriter().print(new Gson().toJson(map));
        response.getWriter().close();
    }