Question

我希望根据在php页面上点击的链接来更改div的内容。链接是通过循环创建的，我需要通过URL传递几个参数。 div也是通过循环创建的，因此div的id将是可变的。我无法使用AJAX来实现这一目标。

下面是我的php：

<?php
if ($result3->num_rows > 0) {

    while($row3 = $result3->fetch_assoc()) {
        $tripDestination = $row3["tripDestination"];
        $sessionID = $row3["$sessionID"];
        $price = $row3["price"];

            echo "<a href=\"#\">" . $tripDestination . ' - ' . $price . "</a>";
            echo "<br />";
            echo "<div id=\"trips\"></div>";
    }
}
 ?>

我需要在URL中传递两个变量：sessionID和tripDestination。我能够加载静态内容，但它需要是动态的。到目前为止，这是我的AJAX

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $.ajax({url: "sqlUpload.php?sessionID=35&tripDestination=SFO", success: function(result){
            $("#div1").html(result);
        }});
    });
});
</script>

提前致谢！

Answer 1

我可能会考虑从链接上的data属性发送信息：

<强> PHP：

<?php
if ($result3->num_rows > 0) {
    while($row3 = $result3->fetch_assoc()) {
        $tripDestination = $row3["tripDestination"];
        $sessionID       = $row3[$sessionID];
        $price           = $row3["price"];
        // Store the organized data
        $data            = array(
                               'tripDestination'=>$tripDestination,
                               'sessionID'=>$sessionID,
                               'price'=>$price
                           );
        ?>
        <!-- You can store the array into json on the data attribute -->
        <a href="#" class="data-set" data-information='<?php echo json_encode($data) ?>'><?php echo $tripDestination.' - '.$price ?></a>
        <br />
        <div class="data-response"></div>
    <?php
    }
}
?>

<强> JavaScript的：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    // When user clicks the <a> that has the "data-set" class
    $('.data-set').on('click',function(e){
        // I like to prevent default here, just incase
        e.preventDefault();
        // Assign current obj
        var getObj  = $(this);
        // Fetch the json from the attribute
        var getData = getObj.data('information');
        // Send
        $.ajax({
            // Just send to the page, no query string
            url: "sqlUpload.php",
            // I would send POST, personally
            type: 'GET',
            // This is the data being sent
            data: getData,
            success: function(response){
                // Presumably you want to put the response into the
                // accompanying div, then you can just do next()
                getObj.next('.data-response').html(response);
        }});
    });
});
</script>

AJAX在PHP循环内单击时更改div值

1 个答案: