conn-6ren">
个人中心
gpt4 book ai didi

javascript - 全局 PHP 头文件中的 JQuery

转载 作者：行者123 更新时间：2023-11-28 06:54:08 27 4
gpt4 key购买 nike

我的头文件中有一个 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 标签。其次，如果您的 $rows 是按顺序放置的，您可能需要使用“foreach”或“for index to n”。

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

关于javascript - 全局 PHP 头文件中的 JQuery，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32707010/

27 4 0
文章推荐： javascript - 表单上的 MVC 提交打开 JQuery 对话框并等待用户响应
文章推荐： Javascript继承需要 parent parent 的功能？
文章推荐： jquery - 同位素 - 砌体流体 columnWidth 和 gutter - 媒体查询
文章推荐： ios - 在此图像上执行某些操作后异步图像加载 - 滚动时图像更改为错误图像
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com