A.3 实验3：动态导航栏

东浔

已于 2022-03-12 15:22:12 修改

阅读量698

点赞数 1

分类专栏： Web应用开发文章标签： php html css

于 2022-03-11 23:10:40 首次发布

本文链接：https://blog.csdn.net/m0_51039351/article/details/123435440

版权

Web应用开发专栏收录该内容

7 篇文章 10 订阅

订阅专栏

A.3 实验3：动态导航栏

A.3.1 目的与要求
A.3.2 实验内容

本实验创建学生-教师子系统的3个动态导航栏模块文件：
(1) navigation.php:主导航栏模块文件，用于学生一教师子系统主页、注册页面和登录页面。保存于教务选课系统项目xk中的“源文件”结点。
(2) navigation_student.php:学生子系统导航栏模块文件，用于学生子系统各页面。保存于教务选课系统项目xk中的“源文件”结点下的student子目录。
(3) navigation_teacher.php:教师子系统导航栏模块文件，用于教师子系统各页面。保存于教务选课系统项目xk中的“源文件”结点下的teacher子目录。

A.3.1 目的与要求

(1)掌握PHP代码与HTML代码在PHP页面文件中交替使用的方法。
(2)掌握PHP变量的定义与使用。
(3)掌握PHP运算符、表达式的使用。
(4)掌握PHP流程控制语句的使用。

A.3.2 实验内容

xk.css

/*48页*/
/*基本样式*/
body {font-size: 14px; letter-spacing: 1.2px}
.title {color: #458994; font-weight: 700}
a {color: steelblue; text-decoration: none}
a:visited {color: steelblue}
a:hover {text-decoration: underline; font-weight: 700}
/*水平导航栏样式*/
.nav {width: 90%; background-color: #eeeeee; margin: 5px auto 5px auto}
.nav .left {float: left; padding: 5px 10px 5px 10px}
.nav .right {float: right; padding: 5px 10px 5px 10px}
.nav .current {background-color: steelblue; color: white}

(1)创建PHP文件 navigation.php，作为能够呈现主导航栏的模块文件，用于学生-教师子系统的主页、注册页面和登录页面。
该模块文件的执行要用到4个变量，当这些变量取不同值时会有不同的呈现效果。下面是这4个输入变量的变量名、含义及可能的取值：

$isLogon={truelfalse}   //是否处于登入状态，取true或false
$1b={同学|老师}   //登录人员的类别，取”同学”或”老师”
$name=<姓名>   //当前登录人员的姓名
$choice = {0|1|2}   //用户选择状态，取0、1或2

当处于未登录状态时，输入变量$isLogon的值为false。

其中，“登录”和“注册”是两个超链接的文本，两个超链接的href属性值可以分别设置为"login_p.php"和"registration_p.php”。两个超链接文本应该根据输入变量$choice的取值，决定是否醒目显示。当$choice为1时，“登录”文本醒目显示，当$choice为2时，“注册”文本醒目显示，当$choice为0时，两个超链接文本都不醒目显示。这种情况不需要输入变量$lb和$name。

navigation.php（未登录）

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="xk.css"/>
    </head>
    <body>
        <?php
            $isLogon = false;
            $lb;
            $name;
            $choice = 1;
        ?>
        <div class="nav">
            <?php if($isLogon){ ?>
                <a class="right" href="logoff.php">退出登录</a>
                <a class="right" href="enter.php">进入系统</a>
                <span class="right"><?php echo $name.$lb."，你好！"?></span>
            <?php }else{ ?>
                <a class="right <?php echo $choice===2 ? "current": ""?>" href="registration_p.php">注册</a>
                <a class="right <?php echo $choice===1 ? "current": ""?>" href="login_p.php">登录</a>
            <?php } ?>
            <div style="clear: both"></div><!--css float浮动产生浮动无法显示背景样式颜色,设置clear清除浮动-->
        </div>
    </body>
</html>

navigation（未登录）
请添加图片描述
当处于登录状态时，变量$isLogon的值为true。

其中，“胡文海”是输入变量$name的值，“同学”是输入变量$lb的值。“进入系统”和“退出登录”是两个超链接的文本，两个超链接的 href 属性值分别设置为”enter.php”和“logoff.php"。这种情况不需要输入变量$choice。

navigation.php（登录）

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="xk.css"/>
    </head>
    <body>
        <?php
            $isLogon = true;
            $lb = "同学";
            $name = "胡文海";
            $choice = 1;
        ?>
        <div class="nav">
            <?php if($isLogon){ ?>
                <a class="right" href="logoff.php">退出登录</a>
                <a class="right" href="enter.php">进入系统</a>
                <span class="right"><?php echo $name.$lb."，你好！"?></span>
            <?php }else{ ?>
                <a class="right <?php echo $choice===2 ? "current": ""?>" href="registration_p.php">注册</a>
                <a class="right <?php echo $choice===1 ? "current": ""?>" href="login_p.php">登录</a>
            <?php } ?>
            <div style="clear: both"></div><!--css float浮动产生浮动无法显示背景样式颜色,设置clear清除浮动-->
        </div>
    </body>
</html>

navigation（登录）
请添加图片描述
(2)创建PHP文件 student\navigation_student.php，作为能够呈现学生子系统导航栏的模块文件，用于学生子系统各页面。
该导航栏模块文件的执行要用到2个变量，当这些变量取不同值时会有不同的呈现效果。下面是这2个输入变量的变量名、含义及可能的取值：

name =<姓名>   //当前登录学生的姓名
$choice={1|2|3}   //用户选择状态，取1、2或3

这里，“浏览课程信息” “选课” “查看成绩”和“退出”都是超链接的文本，这些超链接的href属性值分别设置如下：

浏览课程信息：course_p.php。
选课：elective_p.php。
查看成绩：score_view_p.php。
退出：…/index.php。

这些超链接文本应该根据输入变量$choice的取值，决定是否醒目显示。当$choice分别取1、2和3时，超链接文本“浏览课程信息” “选课”和“查看成绩”分别醒目显示。

navigation_student.php

<html>
    <head>
        <title></title>
        <meta charset="UTF-8">
        <link rel="stylesheet" type="text/css" href="xk.css"/>
    </head>
    <body>
        <?php
            $name = "胡文海";
            $choice = 1;
        ?>
        <div class="nav">
            <a class="left <?php echo $choice===1 ? "current":""?>" href="course_p.php">浏览课程信息</a>
            <a class="left <?php echo $choice===2 ? "current":""?>" href="elective_p.php">选课</a>
            <a class="left <?php echo $choice===3 ? "current":""?>" href="score_view_p.php">查看成绩</a>
            <a class="right" href="../index.php">退出</a>
            <span class="right"><?php echo $name."同学，你好！"?></span>
            <div style="clear: both"></div><!--css float浮动产生浮动无法显示背景样式颜色,设置clear清除浮动-->
        </div>
    </body>
</html>

navigation_student
请添加图片描述
(3)创建PHP文件 teacher/navigation_teacher.php，作为能够呈现教师子系统导航栏的模块文件，用于教师子系统的各页面。
该导航栏模块文件的执行要用到2个变量，当这些变量取不同值时会有不同的呈现效果。下面是这2个输入变量的变量名、含义及可能的取值：

name =<姓名>   //当前登录教师的姓名
$choice={1|2|3}   //用户选择状态，取1、2或3

这里，“课程列表” “编辑课程信息” “录入成绩”和“退出”都是超链接的文本，这些超链接的href属性值分别设置如下：

课程列表：course_teacher_p.php。
编辑课程：course_edit_p.php。
录入成绩：score_input_p.php。
退出：…/index.php。

这些超链接文本应该根据输入变量$choice的取值，决定是否醒目显示。当$choice分别取1、2和3时，超链接文本“课程列表” “编辑课程信息”和“录入成绩”分别醒目显示。

navigation_teacher.php

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="xk.css"/>
    </head>
    <body>
        <?php
            $name = "吴蕊";
            $choice = 1;
        ?>
        <div class="nav">
            <a class="right" href="../index.php">退出</a>
            <span class="right"><?php echo $name."老师，你好！" ?></span>
            <a class="left <?php echo $choice===1 ? "current":"" ?>" href="course_teacher_p.php">课程列表</a>
            <a class="left <?php echo $choice===2 ? "current":"" ?>" href="course_edit_p.php">编辑课程信息</a>
            <a class="left <?php echo $choice===3 ? "current":"" ?>" href="score_input_p.php">录入成绩</a>
            <div style="clear: both"></div><!--css float浮动产生浮动无法显示背景样式颜色,设置clear清除浮动-->
        </div>
    </body>
</html>