RESTful风格实战（ajax+RESTful+button实现交互）

最新推荐文章于 2023-03-01 15:46:45 发布

小白丿

最新推荐文章于 2023-03-01 15:46:45 发布

阅读量546

点赞数

文章标签： restful ajax

本文链接：https://blog.csdn.net/qq_40796888/article/details/122351787

版权

欢迎页面有四个按钮分别实现get、post、put、delete四种传输方式
并返回响应消息

程序中用的ajax来改变传输方式
在controller类中响应

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>欢迎页</title>
    <script src="webjars/jquery/3.6.0/dist/jquery.min.js"></script>

    <script>
        function get(){
            $.ajax({
                url:"/Index/RESTful",
                type:"get",
                success:function(text){
                    window.alert(text);
                }
            })
        }

        function post(){
            $.ajax({
                url:"/Index/RESTful",
                type:"post",
                success:function(text){
                    window.alert(text);
                }
            })
        }


        function put(){
            $.ajax({
                url:"/Index/RESTful",
                type:"put",
                success:function(text){
                    window.alert(text);
                }
            })
        }

        function delet(){
            $.ajax({
                url:"/Index/RESTful",
                type:"delete",
                success:function(text){
                    window.alert(text);
                }
            })
        }

    </script>
</head>
<body>
    <h1>欢迎页</h1>
        <button id="get" onclick="get()">GET</button>
        <button id="delete" onclick="delet()">DELETE</button>
        <button id="put"  onclick="put()">PUT</button>
        <button id="post" onclick="post()">POST</button>
</body>
</html>

indexController

package com.igeek.controller;
import org.springframework.web.bind.annotation.*;

@RestController
@RequestMapping("/Index")
public class IndexController {

    @GetMapping("/RESTful")
    public String getRESTful(){
        return "点击了Get";
    }

    @DeleteMapping("/RESTful")
    public String deleteRESTful(){
        return "点击了delete";
    }
    @PutMapping("/RESTful")
    public String putRESTful(){
        return "点击了put";
    }
    @PostMapping("/RESTful")
    public String postRESTful(){
        return "点击了post";
    }
}

效果图

在这里插入图片描述

小白丿

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
RESTful风格实战（ajax+RESTful+button实现交互）

欢迎页面有四个按钮分别实现get、post、put、delete四种传输方式并返回响应消息程序中用的ajax来改变传输方式在controller类中响应index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>欢迎页</title> <script src="webjars/jquery/3..
复制链接

扫一扫