在thymeleaf中使用js获取后台值传到前台的值（已验证）

梦里梦外; 2023-06-05 12:57 2阅读 0赞

在thymeleaf中使用js获取后台值传到前台的值  
首先我们看效果：（我以修改为例子）  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzk3NDQ2Ng_size_16_color_FFFFFF_t_70]  
thymeleaf模块的代码：  
html：

js:

// 修改
    	$('.change').each(function(){
        
    		$(this).click(function(){
        
    			$.ajax({
        
    				type: 'GET',
    				url: 'titles',
    				data: {
        
    					'id': $(this).parent().prev().prev().text()
    				},
    				success: function(data){
        
    					if(data.code === 1) {
        
    						window.location.href = `titlesz?id=${
        data.data.id}`
    					}	
    				}
    			})
    		})
    	})
    	
    spring boot :
    
    ```java
    // 根据id查询  标题表     
    	@RequestMapping(value="/titlesz",method=RequestMethod.GET)
    	public String agentMgzrInId(@RequestParam Integer id,HttpSession session){
        
    		if(id==null){
        
    			session.setAttribute("i","id为空");
    		}
    		Titles title = userService.findTitlesId(id);
    		String i="";
    		if(title ==null) {
        
    			i="暂无数据";
    			session.setAttribute("i",i);
    		}else {
        
    			session.setAttribute("i",i);
    			session.setAttribute("title",title);
    		}
    		return "titleUpdate";
    	}

另外一个页面，修改页面：  
html：

js:(渲染)

//获取url的参数
        function GetQueryString(name) {
        
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            console.log(reg);
            var r = window.location.search.substr(1).match(reg);
            console.log(r);
            if (r != null) return unescape(r[2]);
            return null;
        };
    
        let id = GetQueryString('id');
        $.ajax({
        
            type: "get",
            url: `titles?id=${
        id}`,
            success: function(data){
        
                if(data.code === 1) {
        
                    $('#title').val(data.data.title)
                }
            }
        })

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzk3NDQ2Ng_size_16_color_FFFFFF_t_70]: /images/20230601/abf867805ceb40c88f9103b432726bf0.png