web前端修改/添加界面

最新推荐文章于 2025-04-15 09:27:31 发布

不_要_挂_科

最新推荐文章于 2025-04-15 09:27:31 发布

阅读量699

点赞数

文章标签：前端 css css3

本文链接：https://blog.csdn.net/m0_57315637/article/details/130323533

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=, initial-scale=1.0">
    <title>实验六</title>
    <script src="./jquery-3.1.1.min.js"></script>
    <style>
        body{
            margin: 0;
            padding: 0;
            text-align: center;
            background: url(img/背景2.jpg);
            background-size:cover;
        }

        #left{
            width: 700px;
            height: 600px;
            background: rgb(255, 255, 255,0.5);
            float: left;
            border-radius: 20px;
            /* 居中 */
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }
        input{
            width: 270px;
            border-top-style:hidden;
            border-right-style:hidden;
            border-left-style:hidden;
            background:none;
            margin: 0;
            text-align: center;
        }
        p{
            color: gray;
        }
        #submit{
            margin: 5px;
            width: 250px;
            height: 33px;
            border-radius: 20px;
            border: 0px;
            background-color: #c0ca33;
            color: #FFF;
            font-size: 16px;
        }
    </style>
</head>
<body>
    <div id="left">
        <br>
        <h2>添加学生</h2>
        <p>
            学号<span id="afterem"></span>
            <br>
            <input type="text" id="id">
        </p>
        <p>
            姓名<span id="afterun"></span><br>
            <input type="text" id="name">
        </p>
        <p>
            专业<span id="afterun"></span><br>
            <input type="text" id="major">
        </p>
        <p>
            年级<span id="afterun"></span><br>
            <input type="text" id="grade">
        </p>
        <p>
            电话<span id="afterun"></span><br>
            <input type="text" id="phone">
        </p>
        <p>
            地址<span id="afterun"></span><br>
            <input type="text" id="address">
        </p>
        <p>
            籍贯<span id="afterun"></span><br>
            <input type="text" id="native">
        </p>
        <p>
            性别<span id="afterun"></span><br>
            <input type="text" id="gender">
        </p>

        <input type="submit" id="submit">
    </div>

    <script>
        $("#submit").click(function(){
            var loc = window.location.href;
            var param = loc.split("?")[1];
            var au = param.split("=");
            
            var student = {
                stuaddess: $("#address").val(),
                stugender: $("#gender").val(),
                stugrade: $("#grade").val(),
                stuid: $("#id").val(),
                stumajor: $("#major").val(),
                stuname: $("#name").val(),
                stunative: $("#native").val(),
                // stuno: $("#no").val(),
                stuno: 0,
                stuphone: $("#phone").val(),

            };
            student=JSON.stringify(student);
            $.ajax({
                type: "post",
                url: "http://114.67.241.121:8088/stu/add",
                dataType: "json",
                contentType: "application/json;charset=utf-8",
                data: student,
                headers:{
                      'Authorization':au[1],
                },
                success: function (rsp) {
                    window.location.href="./2.html?au="+au[1];
                },
                    
            })
        })
    </script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>实验六</title>
    <script src="./jquery-3.1.1.min.js"></script>
    <style>
        body{
            margin: 0;
            padding: 0;
            text-align: center;
            background: url(img/背景2.jpg);
            background-size:cover;
        }

        #left{
            width: 700px;
            height: 600px;
            background: rgb(255, 255, 255,0.5);
            float: left;
            border-radius: 20px;
            /* 居中 */
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }
        input{
            width: 270px;
            border-top-style:hidden;
            border-right-style:hidden;
            border-left-style:hidden;
            background:none;
            margin: 0;
            text-align: center;
        }
        p{
            color: gray;
        }
        #submit{
            margin: 5px;
            width: 250px;
            height: 33px;
            border-radius: 20px;
            border: 0px;
            background-color: #c0ca33;
            color: #FFF;
            font-size: 16px;
        }
    </style>
</head>
<body>
    <div id="left">
        <br>
        <h2>修改学生</h2>
        <p>
            学号<span id="afterem"></span>
            <br>
            <input type="text" id="id">
        </p>
        <p>
            姓名<span id="afterun"></span><br>
            <input type="text" id="name">
        </p>
        <p>
            专业<span id="afterun"></span><br>
            <input type="text" id="major">
        </p>
        <p>
            年级<span id="afterun"></span><br>
            <input type="text" id="grade">
        </p>
        <p>
            电话<span id="afterun"></span><br>
            <input type="text" id="phone">
        </p>
        <p>
            地址<span id="afterun"></span><br>
            <input type="text" id="address">
        </p>
        <p>
            籍贯<span id="afterun"></span><br>
            <input type="text" id="native">
        </p>
        <p>
            性别<span id="afterun"></span><br>
            <input type="text" id="gender">
        </p>

        <input type="submit" id="submit">
    </div>

    <script>
        $(function(){
            var loc = window.location.href;
            var param = loc.split("?")[1];
            var param1 = param.split("&");
            var id = param1[0].split("=");
            var au = param1[1].split("=");

            $(document).ready(function(){
                document.getElementById("id").value=id[1];
            })
        
         $("#submit").click(function(){
            var student = {
                stuaddess: $("#address").val(),
                stugender: $("#gender").val(),
                stugrade: $("#grade").val(),
                stuid: id[1],
                stumajor: $("#major").val(),
                stuname: $("#name").val(),
                stunative: $("#native").val(),
                stuno: $("#no").val(),
                stuphone: $("#phone").val(),
            };
            student=JSON.stringify(student);
            $.ajax({
                type: "post",
                url: "http://114.67.241.121:8088/stu/edit",
                dataType: "json",
                contentType: "application/json;charset=utf-8",
                data: student,
                headers:{
                      'Authorization':au[1],
                },
                success: function (rsp) {
                    window.location.href="./2.html?au="+au[1];
                },
                    
            })
        })
        })
        
    </script>
</body>
</html>