【问题标题】:How to pass Array of JSON Data from one html page to other html page?如何将 JSON 数据数组从一个 html 页面传递到另一个 html 页面?
【发布时间】:2015-03-03 12:05:13
【问题描述】:

我正在为用户创建个人资料页面。我有两个 html 页面:page1: login.htmlpage2:profile.html。从一个页面:1我们登录,成功登录后,它会重定向到userProfile页面:2。我将用户信息从 page1 发送到 page2,如姓名、地址、手机号码、Email-Id 等,采用 JSON 格式,

我想使用会话,而不是 localStorage

JSON 格式为

[{"userInfo":{"id":"1","username":"nee","Name":"Neelabh", "address":"Bangalore","Email":"nee@gmail.com"}}]

我使用此参考来寻求帮助:JqueryMobile (JQM), Json and passing data to a new page

登录页面中的 JavaScript:

 <script type="text/javascript">     
    $(document).ready(function(){       
                var userData = {
                 storeUserDataInSession: function(userData) {
                     var userObjectString = JSON.stringify(userData);                         
                window.sessionStorage.setItem('userObject',userObjectString)
                 },
                 getUserDataFromSession: function() {
                     var userData = window.sessionStorage.getItem('userObject')
                     return JSON.parse(userData);
                 }
                }   

               $("#register-form-header").submit(function(){            

                var uName = $('#userName').val();               
                var upassd=$('#password').val();            

                $.ajax({                                        
                    url:"http://localhost/login/login.php",                     
                    type:"POST",
                    dataType:"json",
                    data:{type:"login",uName:uName,password:upassd},                    

                    ContentType:"application/json",
                    success: function(response){    
                        $.each(response, function(index,value){                           


                        }); 
                        //alert(JSON.stringify(response[0]));

               userData.storeUserDataInSession(response);

                        window.location = 'userProfile.html';   
                        return false;                                   
                    },
                    error: function(err){                           
                        //alert(JSON.stringify(err));
                        alert("fail");
                        window.location.href = 'error.html';
                    }           
                });
                return false; 

        });
        //loadJSON(0);
    });
</script> 

个人资料页面中的javascript

<script>

  $( document ).ready(function() {
       var userData = {
         storeUserDataInSession: function(userData) {
             var userObjectString = JSON.stringify(userData);
             window.sessionStorage.setItem('userObject',userObjectString)
         },
         getUserDataFromSession: function() {
             var userData = window.sessionStorage.getItem('userObject')
             return JSON.parse(userData);
         }
        } 

        var userDataObject=userData.getUserDataFromSession();
        var data=userDataObject[0].userInfo.username;           
        alert(data);            
  }); 
</script>

此个人资料页面成功完全可以打印 HardcodedInfo "Neelabh",我不知道如何将 JSON 数组数据发送到其他页面, 请检查我提到的 Json 数组数据,

PHP 代码

$result=mysql_query($query);
            $totalRows=mysql_num_rows($result); 
            if($totalRows>0){
                $recipes=array();
                while($recipe=mysql_fetch_array($result, MYSQL_ASSOC)){
                    $recipes[]=array('userInfo'=>$recipe);
                }
                echo json_encode($recipes);         
            }   

以上代码是工作代码感谢 Mateusz Majewski

【问题讨论】:

  • 如果您希望在移动设备上的浏览器之间保持一致性,不幸的是,您将不得不使用 cookie 来传递数据。 Safari 的隐私浏览模式不支持 Local/SessionStorage。
  • @denisol,你能告诉我更多关于它的信息吗..

标签: javascript php jquery html json


【解决方案1】:
var userData = {
 storeUserDataInSession: function(userData) {
     var userObjectString = JSON.stringify(userData);
     window.sessionStorage.setItem('userObject',userObjectString)
 },
 getUserDataFromSession: function() {
     var userData = window.sessionStorage.getItem('userObject')
     return JSON.parse(userData);
 }
}

然后在你的 success() 回调中你做

userData.storeUserDataInSession(response);

检索您运行的数据

userData.getUserDataFromSession()

【讨论】:

  • 我将在哪里定义这个函数, var userData = { storeUserDataInSession: function(userData) { var userObjectString = JSON.stringify(userData); window.sessionStorage.setItem('userObject',userObjectString) }, getUserDataFromSession: function() { var userData = window.sessionStorage.getItem('userObject') return JSON.parse(userData); } }
  • @neelabhsingh 您可以在 $(document).ready(function() 块中执行此操作,但这没关系。它可以从任何地方访问
  • 请检查我们必须在 userData.storeUserDataInSession(JSON.stringify(response[0])) 中使用 response[0];我还有一个问题我将如何在用户个人资料页面中获取单独的数据、姓名、电子邮件、移动设备..
  • 你可以这样做: var userDataObject = userData.getUserDataFromSession() 。然后你可以像这样检索电子邮件:userDataObject[0].userInfo.Email.
  • 感谢您的回复,正如您建议的那样,它不起作用,var data=userDataObject[0].userInfo.username;
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-10-06
  • 1970-01-01
  • 1970-01-01
  • 2023-03-30
  • 2011-04-15
  • 1970-01-01
相关资源
最近更新 更多