怎么把前端一个页面的值传到另一个页面

最新推荐文章于 2024-07-24 23:00:08 发布

不想写，还得写，写就写，慢慢写

最新推荐文章于 2024-07-24 23:00:08 发布

阅读量1.2k

点赞数 1

文章标签：前端 javascript 开发语言

本文链接：https://blog.csdn.net/m0_74331185/article/details/128201085

版权

  success:function(result){
                        console.log(result)
                        let a = $("#uname").val()
                        let b = $("#upwd").val()
                        let c = $("#yz").val()
                        if(result[0].user_name==a && result[0].password==b && c=="输入正确"){ //如果输入的密码和
                            alert("登陆成功")
                            localStorage.setItem("name",result[0].user_name)
                            localStorage.setItem("src",`http://127.0.0.1:7000/images/uploads/${result[0].head_portrait}`)
                            localStorage.setItem("sex",result[0].user_sex)
                            localStorage.setItem("phone",result[0].user_phone)
                            location.href="xs.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>Document</title>
    <script src="../ajax/jquery-3.5.1.js"></script>
    <style>
        #d2{
            margin: 100px 200px;
            border: 1px solid skyblue;
            width: 500px;
            height: 300px;
            
        }
        img{
            width: 200px;
            height: 100px;
        }
    </style>
</head>
<body>
    <div id="d2">
        <h2 id="h2"></h2>
        <img src="" alt="" id="img">
        <h3 id="xb">性别：</h3>
        <h3 id="dh">电话号码：</h3>
    </div>

    <script>
        $(function(){
            console.log(localStorage.getItem("src"))
           $("#h2").html("您好:  "+localStorage.getItem("name"))    
           $("#img").attr("src",localStorage.getItem("src"));
           $("#xb").html("性别： "+localStorage.getItem("sex"))
           $("#dh").html("电话号码:  "+localStorage.getItem("phone"))
        })
    </script>
</body>
</html>

接收页面↑

第一步：

在第一个页面的sussess中，通过 localStorage.setItem（自己创建的属性名，后台传过来的对应的值）

第二步：

然后创建一个新的页面在新的页面里可以在$(function(){})里面用

localStorage.getItem("自己创建的属性名")

这样↑的方式获取到然后随便加到那个标签里去就可以形成页面了

当然sussess的值是后台穿过来的（在前端写$.ajax中的）