如何解决这段代码中的问题并发送ajax调用？

Question

$(文档).ready(函数() { $("#get").click(function() {

    debugger;


        $.ajax({
            url: `https://jsonplaceholder.typicode.com/posts`,
            type:'#method',
            data: {
                title:$("#title ").val(),
                body : $("#body").val(),
                userId : $("#userid").val(),
            },
            dataType: 'json',
            success: function(data) {
                        $.each(data, function(i, item) {
                            $("tbody").append("<tr><td>" + item.id + "</td><td>" + item.title + "</td><td>" + item.body + "</td><td>" + item.userId + "</td></tr>");
                            // url.value = "";
                            method.value = "";
                            title.value = "";
                            body.value = "";
                            userid.value = "";
                        });
                      
                    
                    
                
                
            },
        });
});

});

$(document).ready(function() {
    $("#post").click(function() {
       
        //  debugger;
       
    
        
    
            $.ajax({
                url: `https://jsonplaceholder.typicode.com/posts`,
                type: '#method',
                data: {
                    title : $("#title ").val(),
                    body : $("#body").val(),
                    userId : $("#userid").val(),
                },
                dataType: 'json',
                success: function(data) {
                    
                        $("tbody").append("<tr><td>" + data.id + "</td><td>" + data.title + "</td><td>" + data.body + "</td><td>" + data.userId + "</td></tr>");
                        // url.value = "";
                        method.value = "";
                        title.value = "";
                        body.value = "";
                        userid.value = "";
                }   
            });
    });

});



$(document).ready(function() {
    $("#get").click(function() {
       
        debugger;
    
    
            $.ajax({
                url: `https://jsonplaceholder.typicode.com/posts`,
                type:'#method',
                data: {
                    title:$("#title ").val(),
                    body : $("#body").val(),
                    userId : $("#userid").val(),
                },
                dataType: 'json',
                success: function(data) {
                            $.each(data, function(i, item) {
                                $("tbody").append("<tr><td>" + item.id + "</td><td>" + item.title + "</td><td>" + item.body + "</td><td>" + item.userId + "</td></tr>");
                                // url.value = "";
                                method.value = "";
                                title.value = "";
                                body.value = "";
                                userid.value = "";
                            });
                          
                        
                        
                    
                    
                },
            });
    });

});

body {
    font-family: Arial, Helvetica, sans-serif;
}

* {
    box-sizing: border-box
}
/* Full-width input fields */

input[type=text],
input[type=password] {
    width: 100%;
    padding: 15px;
    margin: 5px 0 22px 0;
    display: inline-block;
    border: none;
    background: #f1f1f1;
}

input[type=text]:focus,
input[type=password]:focus {
    background-color: #ddd;
    outline: none;
}

hr {
    border: 1px solid #f1f1f1;
    margin-bottom: 25px;
}
/* Set a style for all buttons */

button {
    background-color: #04AA6D;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 100%;
    opacity: 0.9;
}

button:hover {
    opacity: 1;
}
/* Extra styles for the cancel button */

.cancelbtn {
    padding: 14px 20px;
    background-color: #f44336;
}
/* Float cancel and signup buttons and add an equal width */

.cancelbtn,
.signupbtn {
    float: left;
    width: 50%;
}
/* Add padding to container elements */

.container {
    padding: 16px;
}
/* Clear floats */

.clearfix::after {
    content: "";
    clear: both;
    display: table;
}
/* Change styles for cancel button and signup button on extra small screens */

@media screen and (max-width: 300px) {
    .cancelbtn,
    .signupbtn {
        width: 100%;
    }
}

<!DOCTYPE html>
<html>

<head>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <link rel="stylesheet" href="style.css">

</head>

<body>
    <div class="container">
        <h1>Form</h1>
        <hr>


        <!-- <label for="url"><b>Url</b></label>
        <input type="text" placeholder="Enter id" name="url" id="url" required> -->

        <label for="name"><b>Method</b></label>
        <input type="text" placeholder="Enter name" name="method" id="method" required>

        <label for="title"><b>title</b></label>
        <input type="text" placeholder="Enter title" name="title" id="title" required>

        <label for="body"><b>body</b></label>
        <input type="text" placeholder="Enter body" name="body" id="body" required>

        <label for="userid"><b>userid</b></label>
        <input type="text" placeholder="Enter userid" name="userid" id="userid" required>


        <button id="post">post</button>
        <button id="get">get</button>
    </div>

    <div class="container">
        <table class="table table-striped" id="show">
            <thead>
                <tr>
                    <th><b>id</b></th>
                    <th><b>title</b> </th>
                    <th><b>body</b></th>
                    <th><b>userId</b></th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
    <script src="index.js"></script>
</body>

</html>

**我在这段代码中遇到问题。我创建了两个函数，一个用于ajax post请求，第二个获取ajax请求，但在get函数中我遇到了问题我创建了两个函数，一个用于ajax post请求，第二个获取ajax请求，但在get函数中我有一个问题**

Answer 1

您可以尝试

type:$('#method').val(),

代替 type:'#method',