thymeleaf 局部刷新,类似iframe嵌套效果。

实现左边为菜单树,右边局部载入子界面(.html)左边不需刷新,右边内容动态加载界面。(在springboot ,thymeleaf下运行)
1:jquery的load和iframe方式领导不给使用。
2:可有thymeleaf特有的方式??

···

HTML代码


               </div>
  </div>
···· 

····
   控制器返回
    @GetMapping("comments/{blogId}")
public String comments(@PathVariable Long blogId , Model model){
    model.addAttribute("comments",commentService.listCommentById(blogId) );
    return "blog :: commentList";
}

····
···
       这个
      $('#commentpost-btn').click(function () {
       var boo = $('.ui.form').form('validate form');
       if (boo) {
           console.log('校验成功');
           postData();
       } else {
           console.log('校验失败');
       }

   });




             /*-------------发送请求--------------------------*/
   function postData() {
       $("#comment-container").load(/*[[@{/comments}]]*/"",{
           "parentComment.id" : $("[name='parentComment.id']").val(),
           "blog.id" : $("[name='blog.id']").val(),
           "nickname": $("[name='nickname']").val(),
           "email"   : $("[name='email']").val(),
           "content" : $("[name='content']").val()
       },function (responseTxt, statusTxt, xhr) {

// $(window).scrollTo($('#comment-container'),500);
clearContent();
});
}
···

你可以试试 我用thymeleaf就是这个局部刷新的

图片说明

使用xmlhttp思路感觉可行
1:xmlhttp.open("POST",url,true);
2:$("#content").html(xmlhttp.responseText); (可获html元素代码,通过html()改变内容显示)

xmlhttp.open("POST",url,true);

thymeleaf作为服务端渲染的框架,渲染操作肯定不能在客户端执行。所以你提出第二种疑问是想不通的。可以考虑写原生的dom操作,或者使用如vue来完成局部更新