Question

我想使用＆＃39; sID＆＃39;在第一个HTML表单中从数据库中检索数据，然后在第二个HTML页面上使用从数据库中检索的数据。我可以用php做到这一点，但我无法弄清楚如何使用ajax。

我对javascript / ajax很新，所以请温柔地回答你的问题：）

HTML 1

            <div class="moreR">             
                 <form action="moreR_2.0.php" method="GET">
                    <input type="hidden" name="sID[]" value="a_certain_ID"/>
                   <input type="image" src="Icons/PNG/greater_than.png" alt="submit"/>
                </form>
            </div>

PHP（moreR_2.0.php）

<?php
        include ('session_start.php');        
        include ('db_connect_mO.php');

    if (isset($_GET['sID'])) {
        foreach($_GET['sID'] as $sID) { 
            }
}

    $sql = mysqli_query($con, "SELECT * FROM mo WHERE sID=$sID");
    $row = mysqli_fetch_array($sql);

        while ($row = mysqli_fetch_assoc($sql)) 

        {           
            $test[]= array( 
                            'pZero'=> $row['pZero'],
                            'pZero_Gname'=> $row['gZero_key'],  
                        );
        }

        header('Content-Type: application/json');
        echo json_encode ($test);

        //detailed error reporting
        if (!$sql) 
        {
            echo 'MySQL Error: ' . mysqli_error($db);
        exit;

        }
?>

的JavaScript

$(document).ready(function() {

    "use strict"; 

    function connect2mR() { 

    $.ajax({
        url:"moreR_2.0.php",
        type: "GET",
        data:'sID',
        dataType:"json",
        //async:false,
        success:function(data)
        {    
            $('#pZero').html('<img src="rPlanets/' + this.gZero + '.png" alt=""/>');
            $('#pZero_keys').html(this.gZero_key);
        }, //success


    }); //end of ajax

    } //end of function

    if (window.attachEvent) {window.attachEvent('onload', connect2mR);}
    else if (window.addEventListener) {window.addEventListener('load',     connect2mR, false);}
    else {document.addEventListener('load', connect2mR, false);}

    });

HTML 2

<section class="moreR_section">
    <div style="width:20%;"><div id="pZero"></div></div>
    <div class="moreR_g" style="margin-left:26%" id="pZero_keys"></div>
</section>

我想做的是;从HTML 1开始，收集sID - ＆gt;然后PHP / JS使用HTML 1中的sID从数据库中获取数据 - ＆gt;然后在HTML 2上使用数据库的结果。目前我正在努力研究如何使这个过程发挥作用。无法弄清楚如何从HTML 1开始，最终以HTML 2结束。

Answer 1

您根本没有从输入元素中获取数据。将您的ajax代码更改为以下。

$.ajax({
    url:"moreR_2.0.php",
    type: "GET",
    data:{sID: $('input[name="sID[]"]').val()},  // this is the change
    dataType:"json",
    //async:false,
    success:function(data)
    {    
        $('#pZero').html('<img src="rPlanets/' + this.gZero + '.png" alt=""/>');
        $('#pZero_keys').html(this.gZero_key);
    }, //success


}); //end of ajax

修改1：您可以使用localstorage保存数据，并在需要时从那里检索。所以你可以这样做

在HTML 1中写下这个。

localStorage.setItem('sID', JSON.stringify( $('input[name="sID[]"]').val()));

在HTML 2中，您可以通过从本地存储中读取值来访问该值，如下所示

var sIDofHTML1 = JSON.parse(localStorage.getItem('sID'));

Answer 2

您必须更新ajax，如下所示。

data:'sID',  // this has to change to data:'sID='+sID,


$.ajax({
    url:"moreR_2.0.php",
    type: "GET",
    data:'sID',  // this has to change to data:'sID='+sID,
    dataType:"json",
    //async:false,
    success:function(data)
    {    
        $('#pZero').html('<img src="rPlanets/' + this.gZero + '.png" alt=""/>');
        $('#pZero_keys').html(this.gZero_key);
    }, //success


}); //end of ajax

如何使用来自一个HTML页面的数据来检索要使用ajax在另一个HTML页面上使用的数据

HTML 1

PHP（moreR_2.0.php）

的JavaScript

HTML 2

2 个答案: