JQuery在全局PHP头文件

JQuery in Global PHP Header File

本文关键字：文件 PHP 全局 JQuery      更新时间：2023-09-26

我有一个JQuery脚本，在头文件中，但它对html的主体没有影响。

头文件代码

  
<?php
include('/templates/header.php');
$host = "localhost"; // Host name 
$username = "root"; // Mysql username 
$password = ""; // Mysql password 
$db_name = "datacentre"; // Database name 
$tbl_name = "data_centre_users"; // Table name 
$server_name = "localhost";
// Create connection
$con = new mysqli($server_name, $username, $password, $db_name, 3306);
if($con->connect_error){
   die("Connection failed: ".$con->connect_error);
}
// Check connection
if($con->connect_error){
 die("Connection failed: ".$conn->connect_error);
}
$sql = "SELECT * FROM $tbl_name ";
$result = $con->query($sql);
<table >
             <thead>
             <tr class="header">
                <th class="center"><strong>ID</strong></th>
                <th class="center"><strong>FirstName</strong></th>
                <th class="center"><strong>Lastname</strong></th>
                <th class="center"><strong>Department</strong></th>
                <th class="center"><strong>Unit</strong></th>
                <th class="center"><strong>Request</strong></th>
                <th class="center"><strong>Purpose</strong></th>
                <th class="center"><strong>Description</strong></th>
                <th class="center"><strong>Status</strong></th>
                <th class="center"><strong>Approved / Denied By</strong></th>               
            </tr>
           </thead>
            <?php
            if($result->num_rows > 0){
                // output data of each row
                while($rows = $result->fetch_assoc()){ ?>
                    <tbody>
                      <tr>
                        <td class="center"><?php echo $rows['id']; ?></td>
                        <td class="center"><?php echo $rows['first_name']; ?></td>
                        <td class="center"><?php echo $rows['last_name']; ?></td>
                        <td class="center"><?php echo $rows['department']; ?></td>
                        <td class="center"><?php echo $rows['unit']; ?></td>
                        <td class="center"><?php echo $rows['request']; ?></td>
                        <td class="center"><?php echo $rows['purpose']; ?></td>
                        <td class="center"><?php echo $rows['description']; ?></td>
                        
                        <td class="center"><?php echo $rows['status']; ?></td>
                        <td class="center"><?php echo $rows['approved_by']; ?></td>
                    </tr>
                 </tbody>
                        
                    <?php
                }
            }
            ?> 
</table>
<?php
$con->close();
include('/templates/footer.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="layout.css">
<script src="jquery-1.11.3.min.js"></script>
<script>
$('table').on('scroll', function () {
    $("table > *").width($("table").width() + $("table").scrollLeft());
});
</script>
</head>
<div>
<body>
<header> 
<a href="/datacentre/admin/index.php" title="Return to the homepage" id="logo">
 </header> 
the body code
<!-- begin snippet: js hide: false -->

CSS代码

/* CSS reset */
{
  margin: 0;
  padding: 0;
}
/* to create a sticky footer */
footer {
  height: 25px;
  position: fixed;
  bottom: 0;
  width: 100%
}
/* styling the tables */
table {
  border-radius: 20px;
  background-color: transparent;
  color: black;
  width: 500px;
  text-align: left;
  border-collapse: collapse;
  overflow-x: scroll;
  display: block;
}
tbody {
  overflow-y: scroll;
  overflow-x: hidden;
  height: 140px;
}
td,
th {
  border: 1px solid #999;
  padding: 0.5rem;
  text-align: left;
}
tbody tr:nth-child(odd) {
  background: #eec;
}
td:hover {
  /* th:hover also if you wish */
  background: #aef;
}
tbody tr:hover {
  /* th:hover also if you wish */
  background: #bdf;
}
td {
  border-top: 1px solid #FB7A31;
  border-bottom: 1px solid FB7A31;
}
th {
  padding: 0 5em 0 0.5em;
  background-color: #ffc;
  border-top: 1px solid #FB7A31;
  border-bottom: 1px solid #FB7A31;
}
caption {
  font-size: 1.2 em;
  font-weight: bold;
}
.center {
  text-align: center;
}
#last-row {
  border-bottom: 1px solid #FB7A31;
}
section#content {
  display: block;
  min-width: 95%;
  min-height: 80%;
}
div#scroll-table {
  overflow: auto;
  overflow-x: scroll;
  overflow-y: scroll;
  minimum-width: 99%;
  height: 350px;
}
table {
  border-collapse: collapse;
  margin: auto;
  width: 70%;
}
td {
  border-top: 1px solid #FB7A31;
  border-bottom: 1px solid FB7A31;
}
th {
  padding: 0 5em 0 0.5em;
  background-color: #ffc;
  border-top: 1px solid #FB7A31;
  border-bottom: 1px solid #FB7A31;
}
caption {
  font-size: 1.2 em;
  font-weight: bold;
}
.center {
  text-align: center;
}
#last-row {
  border-bottom: 1px solid #FB7A31;
}
th div {
  position: absolute;
  background: transparent;
  color: #fff;
  padding: 9px 25px;
  top: 0;
  margin-left: -25px;
  line-height: normal;
  border-left: 1px solid #800;
}
th:first-child div {
  border: none;
}

如何在头文件中包含jquery脚本

首先，在html表代码开始之前，我没有看到结束php标记。其次，如果您的$行是按顺序排列的，您可能需要使用"foreach"或"for index to n"。

最后，我认为这个问题应该标题为"如何包含php文件作为模板"

相关文章：