php - 如何使用 PHP 文件中的信息动态更改页面的 HTML 内容?

标签 php html multidimensional-array associative-array

所以,我有一个名为 db.php 的 php 文件来复制某种数据库。这基本上是一个带有一些多维关联数组的文件:

<?php
$arrShowcases = array(
    "1"=>array("title"=>"Landing Page", "descr"=>"Welcome!", "img"=>"actions-landing.jpg", "polygon"=>array(
        0=> array(
                "points"=>"1338,4,1338,50,1272,50,1272,4",
                "link"=>"69", 
                "modalbody"=>"This button lets you Signup on the webapp",
                "modaltitle"=>"Signup Button"
            ),
        1=> array(
                "points"=>"1246,12,1249,44,1206,44,1204,14",
                "link"=>"2", 
                "modalbody"=>"This button redirects you for the login form",
                "modaltitle"=>"Login Button"
            )
    )),
    "2"=>array("title"=>"Login page", "descr"=>"Make your login", "img"=>"actions-login.jpg", "polygon"=>array(
        0=> array(
            "points"=>"1338,4,1338,50,1272,50,1272,4",
            "link"=>"69", 
            "modalbody"=>"This button lets you Signup on the webapp",
            "modaltitle"=>"Signup Button"
            ),
        1=> array(
            "points"=>"1246,12,1249,44,1206,44,1204,14",
            "link"=>"69", 
            "modalbody"=>"This button redirects you for your dashboard",
            "modaltitle"=>"Login Button"
            )
    ))
);
?>

然后,我有一个带有部分元素的 html 页面,我需要在其中更改页面标题、副标题、图像和一些多边形点:

  <section>
    <div class="container">
      <div class="row">
        <div class="col-md-3">
          <?php include cfgPath."/includes/menu.html"; ?>
        </div>
        <div class="col-md-9">
          <h1 class="page-header"><i class="glyphicon glyphicon-picture"></i> Landing page</h1>
          <h3>// Lorem ipsum...</h3>
          <div class="col-md-12">
            <div style="position:relative;">
              <img id="pageScreenshot" src="<?php echo cfgRoot; ?>/assets/images/actions-landing.jpg" class="img-responsive" alt="Landing Page"/>
              <svg id="svgImageMap" width="1366" height="768">
                <polygon points="1338,4,1338,50,1272,50,1272,4" data-originalpoints="1338,4 1338,50 1272,50 1272,4" data-id="0"/>
                <polygon points="1246,12,1249,44,1206,44,1204,14" data-originalpoints="1246,12 1249,44 1206,44 1204,14" data-id="1"/>
                <polygon points="378,43,446,42,445,11,377,9" data-originalpoints="378,43 446,42 445,11 377,9" data-id="2"/>
                <polygon points="196,10,367,10,366,42,195,43" data-originalpoints="196,10 367,10 366,42 195,43" data-id="3"/>
                <polygon points="121,16,120,35,164,39,164,17" data-originalpoints="121,16 120,35 164,39 164,17" data-id="4"/>
                <polygon points="14,15,13,40,95,43,95,12" data-originalpoints="14,15 13,40 95,43 95,12" data-id="5">
              </svg>
            </div>
            <!-- data original points: X1,Y1 X2,Y2 X3,Y3 X4,Y4 -->
            </br>
            <a class="btn btn-success btn-sm btn-block" href="<?php echo cfgRoot; ?>/app/showcase/showcaseView.php">Go Back</a>
          </div> <!-- colmd12 -->
        </div> <!-- colmd9 -->
      </div> <!-- row -->
    </div> <!-- container -->
  </section> <!-- section -->

正如您在上面的 html 部分元素中看到的那样,我手写了所有信息。但是,我的目标是使用 db.php 文件提供的内容更改该信息。

我想要像这样的 nameofthepage.php?id=1 (并且数组位置 1 中提供的所有信息都转到 html)或这样:nameofthepage.php?id=2 (以及中提供的所有信息数组的位置 2 转到 html)。有什么建议或技巧来实现这种行为吗?

到目前为止,我尝试这样做:

<?php echo $arrShowcases[positions-that-i-want]["information-that-i-want"]; ?>

更改硬编码的 html,但这并没有给我带来我需要的动态行为。

最佳答案

我希望你能明白这一点。

<?php
    //-----------------------------
    // If id is not sent then stop with page execution. You can redirect or something else.
    if(!isset($_GET["id"])) {
        die("ID not received.");
    }
    // Get that received id because at this point we are sure that id is received because page execution did not stopped before.
    $id = $_GET["id"];
    //-----------------------------
    // Import your "database".
    require_once "db.php";
    //-----------------------------
    // If there is no page with that id, stop page execution.
    if(!isset($arrShowcases[$id])) {
        die("page does not exists.");
    }
    // If there is a page then store it in a variable.
    $page = $arrShowcases[$id];
    //-----------------------------
?>
<section>
    <div class="container">
      <div class="row">
        <div class="col-md-3">
          <?php include cfgPath."/includes/menu.html"; ?>
        </div>
        <div class="col-md-9">
          <h1 class="page-header">
              <i class="glyphicon glyphicon-picture"></i>
              <?= $page['title']; ?> // Echo page title.
          </h1>
          <h3><?= $page['descr']; ?></h3> // Echo page description.
          <div class="col-md-12">
            <div style="position:relative;">
              <img id="pageScreenshot" src="<?php echo cfgRoot; ?>/assets/images/<?= $page['img']; ?>" class="img-responsive" alt="<?= $page['title']; ?>"/> // Echo image filename and page title.
              <svg id="svgImageMap" width="1366" height="768">
                // For each polygon, echo it's points and key as an index (0, 1, 2, 3...)
                <?php foreach ($page["polygon"] as $key => $value) { ?>
                    <polygon points="<?= $value['points']; ?>" data-originalpoints="<?= $value['points']; ?>" data-id="<?= $key; ?>"/>
                <?php } ?>
              </svg>
            </div>
            <!-- data original points: X1,Y1 X2,Y2 X3,Y3 X4,Y4 -->
            </br>
            <a class="btn btn-success btn-sm btn-block" href="<?php echo cfgRoot; ?>/app/showcase/showcaseView.php">Go Back</a>
          </div> <!-- colmd12 -->
        </div> <!-- colmd9 -->
      </div> <!-- row -->
    </div> <!-- container -->
  </section> <!-- section -->

关于php - 如何使用 PHP 文件中的信息动态更改页面的 HTML 内容?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45618037/

相关文章:

php - 使用 .htaccess 启用 PHP 短标签

c++ - 在c++中设置嵌套数组

php - Laravel 5.3 策略如何重定向未经授权的用户

php - 向两个地址发送电子邮件?

c++ - html2文本库

html - 表格中的文本垂直居中

java - 填充二维数组中的主对角线

arrays - typescript - 初始化二维数组错误

javascript - 单击按钮后,下拉菜单将重置

javascript - 使用 jquery 将 div 类定位在另一个 div 旁边