Question

我知道您不能在Javascript中使用PHP。基本上，我想做的是单击网页一侧的链接后，存储在数据库中的信息将出现在另一侧。所以我知道我可以使用javascript使一侧的列表可单击，但我也知道要从数据库中获取要显示的数据，我需要使用PHP来获取它。有办法使这项工作吗？

编辑：这是我当前的一些代码用户单击其中一个列表后，什么时候可以在此处实现PHP？

<script>
  document.getElementById("demo").innerHTML = "My First JavaScript";

  function myFnc(x) {
    if (x == 'Tiger') {
      document.getElementById('imgDiv').innerHTML = 'Img1';
    } else if (x == 'Bull') {
      document.getElementById('imgDiv').innerHTML = 'Img3';
    }
  }

  function myFunc2(x) {
    if (x == 'Hammer') {
      document.getElementById('imgDiv').innerHTML = 'Img2';
    }
  }

</script>

<article>
  <ul style="list-style-type:none">
    <li><a href="#Tiger" onclick="myFnc('Tiger')">Tiger</a></li>
    <li><a href="#Hammerhead" onclick="myFunc2('Hammer')">Hammerhead</a></li>
    <li><a href="#Bull" onclick="myFnc('Bull')">Bull</a></li>
    <li><a href="#Great White">Great White</a></li>
    <li><a href="#Mako">Mako</a></li>
    <li><a href="#Greenland">Greenland</a></li>
    <li><a href="#Whale">Whale</a></li>
    <li><a href="#Thresher">Thresher</a></li>
    <li><a href="#Oceanic">Oceanic WhiteTip</a></li>
    <li><a href="#Goblin">Goblin</a></li>
  </ul>
</article>

<div class="hold">
  <div id="imgDiv"></div>
</div>

Answer 1

这样写

在第一侧，链接应为：

'other_side.php?show_table=true'

另一方面，网站应该是这样的

<?php
if(isset($_GET['show_table'])) {
// connect to database and do database query here
}
?>
<!Doctype html>
<html>
</html>

Answer 2

首先，假设您有下一个数据库：

| id |  product  | price  |
|----|-----------|--------|
|  1 |  Cheese   | 10     |
|  2 |  Milk     | 20     |
|  3 |  Candy    | 5      |

第二，您需要完成 get_data.php 文件，但要打印数据作为JSON。像这样：

[
  {id: 1, product: "Cheese", price: 10},
  {id: 2, product: "Milk",   price: 20},
  {id: 3, product: "Candy",  price: 5}
]

第三，完成这些操作后，使用AJAX调用从 get_data.php 中检索数据，您可以在Jquery和Vanilla JS中找到很多示例。
最后，只需在链接上使用click事件。

在这里您可以找到每个单独任务的示例：

使用php从数据库获取数据： https://www.w3schools.com/php/php_mysql_select.asp
使用JSON将数据打印为JSON，

    <?php
        $data = /** The data from our table **/;
        header('Content-Type:application/json');       
        echo json_encode($data);
    ?>;

使用AJAX POST呼叫：Ajax tutorial for post and get
事件点击：https://www.w3schools.com/jquery/event_click.asp
使用Javascript处理对象：https://www.w3schools.com/js/js_json_parse.asp

我可以结合使用PHP和Javascript吗？

2 个答案: