javascript - 如何使用javascript将json数据从一个html页面传递到另一个html页面?

标签 javascript php jquery json

我必须传递将信息插入数据库表后生成的 Json 数据,现在我必须将此信息传递到其他页面BookingConformation.html

例如,我们将获取表单服务器欢迎 Mittel 先生/夫人,感谢您预订家庭服务,您的预订 ID 是 1。 所以请告诉我如何传递信息,即现在在 javascript 中获取表单服务器我必须将此信息传递到其他页面,请帮助我。

脚本

<script>
    $(document).ready(function(){
        $("#register-form").validate({
            rules: {
                userName: "required",                           
                email: {
                    required: true,
                    email: true
                },                                              
                userContactNumber: "required"                       
            },
            messages: {
                userName: "Please enter your Name",
                userContactNumber: "Please enter your Mobile number",                           
                email: "Please enter a valid email address",                                           
            },
            submitHandler: function(form) {

                var uName = $('#userName').val();   
                var mailId = $('#email').val();                 
                var mobNum = $('#userContactNumber').val();

                $.ajax({                
                    url:"http://localhost/bookRoom/book.php",
                    type:"POST",
                    dataType:"json",
                    data:{type:"booking", Name:uName, Email:mailId,  Mob_Num:mobNum},                                   
                    ContentType:"application/json",
                    success: function(response){
                    //alert(JSON.stringify(response));
                    //alert("success");                     
                    alert(response);
                    var globalarray = [];
                    globalarray.push(response);
                    window.localStorage.setItem("globalarray", JSON.stringify(globalarray));
                    window.location.href = 'BookingConformation.html';
                },
                    error: function(err){                           
                        window.location.href = 'error.html';
                    }
                });
                return false; // block regular submit
            }
        });
    });
</script>

服务器代码

    <?php
    header('Access-Control-Allow-Origin: *');//Should work in Cross Domaim ajax Calling request
    mysql_connect("localhost","root","7128");
    mysql_select_db("service");

    if(isset($_POST['type']))
    {
        if($_POST['type']=="booking"){
            $name = $_POST ['Name'];    
            $mobile = $_POST ['Mob_Num'];
            $mail = $_POST ['Email'];               
            $query1 = "insert into customer(userName, userContactNumber, email) values('$name','$mobile','$mail')";
            $query2 = "insert into booking(cust_email, cust_mobile, cust_name) values('$mail','$mobile','$name')";          

            $result1=mysql_query($query1);          
            $result2=mysql_query($query2);
            $id=mysql_insert_id();
            $value = "Welcome Mr/Mrs ".$name."  Thanks for booking home services your booking id is =  ".$id;
            echo json_encode($value);
        }
    }
    else{
        echo "Invalid format";
    }
?>

BookingConformation.html

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript">
            function myFunction() {
                 var globalarray = [];
                 var arrLinks =[];
                 arrLinks = JSON.parse(window.localStorage.getItem("globalarray"));
                 document.getElementById("booking").innerHTML = arrLinks;
             }
        </script>
    </head>
    <body>  
        <p id="booking" onclick="myFunction()">Click me to change my HTML content (innerHTML).</p>
    </bod

y>

最佳答案

如果这是您真正的服务器端代码那么...它完全不安全。您永远不应该将用户发布的变量直接传递到您的查询中。

$query2 = "insert into booking(cust_email, cust_mobile, cust_name) values('$mail','$mobile','$name')";  

至少使用“mysql_real_escape_string”转义值,或使用准备好的语句。并且...不要再使用 mysql,使用 mysqli,它与您正在使用的几乎相同,但不会很快弃用。

此外,您正在对不需要进行 json 编码的字符串进行 json 编码,它只是一段文本,而不是有效的 json 代码。这可能就是为什么 @SimarjeetSingh Panghlia 答案对你不起作用。

不要对该值进行 json_encoding,而是对结构化数组进行编码。

$response = array( "status" => true );

if(isset($_POST['type']))
    {
        if($_POST['type']=="booking"){
            $name = mysql_real_escape_string( $_POST ['Name'] ));    
            $mobile = mysql_real_escape_string($_POST ['Mob_Num']);
            $mail = mysql_real_escape_string($_POST ['Email']);               
            $query1 = "insert into customer(userName, userContactNumber, email) values('$name','$mobile','$mail')";
            $query2 = "insert into booking(cust_email, cust_mobile, cust_name) values('$mail','$mobile','$name')";          

            $result1 = mysql_query($query1);          
            $result2 = mysql_query($query2);
            $id = mysql_insert_id();

            $response["message"] = "Welcome Mr/Mrs ".$name."  Thanks for booking home services your booking id is =  ".$id;/* make sure you strip tags etc to prevent xss attack */

        }
    }
    else{
        $response["status"] = false;
        $response["message"] = "Invalid format";
    }

    echo json_encode($response);

    /* Note that you are making the query using ContentType:"application/json", */

这意味着无论查询是否成功,您都应该使用 json 进行响应。我还建议使用一个名为 jStorage 的简单 jQuery 插件,它允许轻松获取/设置对象,而无需序列化它们。

关于javascript - 如何使用javascript将json数据从一个html页面传递到另一个html页面?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28469374/

相关文章:

php - 在数据映射器模式中创建对象数组

php - 如何将数组值与 codeigniter 数据库查询中的列进行比较

javascript - 改变时,划掉表格

javascript - 删除嵌套数组的每个最后一个元素并完成最后一个数组

javascript - 将 twitter bootsrap typeahead 置于模态之上

javascript - Handlebars - 预编译模板中的脚本不运行

javascript - 如何将 Chrome Javascript 控制台中的默认缩进自定义为 2 个空格?

php - 如何在 php 中使用 FFMPEG 将 flv 格式转换为 .mp4 格式

javascript - 自定义元素 : monkeypatch disconnected callback

javascript - angular js中没有触发更改事件