1.AJAX LOAD

Question

更新的代码我试图在我的主PHP文件中调用PHP脚本，其中将显示所有内容。我只想用我的PHP脚本显示正在运行的SQL查询的结果。

我还想包括动态显示结果/不刷新页面的可能性。

这是我到目前为止所尝试的，我是Jquery和AJAX的新手。提前谢谢！

JQuery / AJAX部分：

<div id="map_size" align="center">
<script type="text/javascript">
                    //Display station information in a hidden DIV that is toggled
                    //And call the php script that queries and returns the results LIVE
                    $(document).ready(function() {
                    $(".desk_box").click(function() {
                        $id = $(this).attr("data")
                    $("#station_info_"+$id).toggle();

                    $.ajax({
                        url:"display_stationinfo.php",
                        success:function(result){
                    $("#map_size").html(result);
                    }});//end ajax  
                    });//end click
                    });//end ready
    </script>
</div> <!-- end map_size -->

display_station.php（我要调用的脚本）：

<?php
include 'db_conn.php';
//query to show workstation/desks information from DB for the DESKS
$station_sql = "SELECT coordinate_id, x_coord, y_coord, section_name FROM coordinates";
$station_result = mysqli_query($conn,$station_sql);

//see if query is good
if($station_result === false) {
    die(mysqli_error()); 
}


//Display workstations information in a hidden DIV that is toggled
while($row = mysqli_fetch_assoc($station_result)){
    //naming values
    $id       = $row['coordinate_id'];
    $x_pos    = $row['x_coord'];
    $y_pos    = $row['y_coord'];
    $sec_name = $row['section_name'];
    //display DIV with the content inside
$html = "<div class='station_info' id='station_info".$id."' style='position:absolute;left:".$x_pos."px;top:".$y_pos."px;'>Hello the id is:".$id."</br>Section:".$sec_name."</br></div>";
}//end while loop for station_result
    echo $_GET['callback'] . '(' .json_encode($html) . ')';             
mysqli_close($conn); // <-- DO I NEED TO INCLUDE IT HERE OR IN MY db_conn.php SINCE IM INCLUDING IT AT THE TOP?

＆GT;

Answer 1

您应该了解制作jquery ajax calls

的方式

其他基本教程将帮助您进入ajax

http://api.jquery.com/jquery.ajax/

http://www.w3schools.com/jquery/ajax_ajax.asp

http://www.w3schools.com/jquery/jquery_ajax_intro.asp

http://www.w3schools.com/jquery/jquery_ref_ajax.asp

http://www.w3schools.com/jquery/jquery_ajax_get_post.asp

http://www.tutorialspoint.com/jquery/jquery-ajax.htm

既然你没有清楚地解释我正在做出一般性假设的问题，并且会就如何将ajax用于你的目的给你两个答案

1.AJAX LOAD

让我们说你的HTML结构是

<强> HTML

<div id="map_size" align="center"></div>

MY JS FILE

 $(document).ready(function(){

  jQuery("#map_size").load("myphp.php", {}, function() { });
})

<强> PHP

echo "<p>THIS IS TEST FOR DEMO AJAX LOAD</p>"

如果从db中检索，可以做更多事情。

<强> myphp.php

//get number of rows for X,Y coords in the table
while($row = mysqli_fetch_assoc($coord_result)){    
//naming X,Y values
$x_pos = $row['x_coord'];
$y_pos = $row['y_coord'];


//draw a box with a DIV at its X,Y coord     
echo "<div id='desk_box' style='style:absolute;
                                    left: " . $x_pos. " px;
                                    top:  " . $y_pos. " px;'>box number</div>";
    }

您也可以在点击按钮时执行相同的操作并动态加载所有内容而无需刷新页面

2.Jquery Ajax [GET，POST]：Link

也可以使用

<强> HTML

<div id="map_size" align="center"></div>

MY JS FILE

// http://api.jquery.com/jquery.ajax/

 $(document).ready(function(){

   $.ajax({url:"myphp.php",success:function(result){
       $("#map_size").html(result);
   }});
})

<强> myphp.php

//get number of rows for X,Y coords in the table
while($row = mysqli_fetch_assoc($coord_result)){    
//naming X,Y values
$x_pos = $row['x_coord'];
$y_pos = $row['y_coord'];


//draw a box with a DIV at its X,Y coord     
$html = "<div id='desk_box' style='style:absolute;
                                    left: " . $x_pos. " px;
                                    top:  " . $y_pos. " px;'>box number</div>";
    } 
 //create a JSON 
  echo $_GET['callback'] . '(' . json_encode($html ) . ')';

如何在不刷新页面的情况下使用JQuery或AJAX调用PHP脚本？

1 个答案:

1.AJAX LOAD

2.Jquery Ajax [GET，POST]：Link