《jsp程序设计》智多星手机销售网后台设计

该文介绍了基于jsp的智多星手机销售网后台管理系统的设计,实现了前端和后台的菜单功能,包括用户、产品和订单的增删查改。通过iframe框架,用户管理、产品管理和订单管理在右侧展示,左侧菜单栏提供导航。同时,文章提到了前端页面的布局和样式,以及部分关键功能的实现代码,如用户添加、查询和删除等操作。
摘要由CSDN通过智能技术生成

本次实验以课本第十章的智多星手机销售网为基础设计后台管理工程,实现将页面分为左右两个框。左边显示菜单,右边根据菜单选择显示相应的或页面,实现对用户,产品和订单的后台管理。

一、前端

将课本第十章源代码导入myeclipse,在head.txt添加后台管理菜单连接。现在主页包括之前的注册,登录,浏览手机,查询手机,查看购物车,查看订单,退出,主页以及后台菜单。

二、后台菜单

后台菜单iframe框架实现由用户管理,产品管理,订单管理,返回主页和查询表单构成。用户管理,产品管理和订单管理实现用户,产品,订单的增加,查询和管理功能。返回主页则返回前台主页面,查询表单实现对数据库中表单的查询,显示出表单内容。

源代码:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style type="text/css">

.man{ list-style:none; display: none;}

.man li a{ text-decoration:none;list-style:none; color:black;}

body{ font-size:12px;}

ul,li,h2{ margin:0;padding:0;}

ul{ list-style:none;}

#top{ width:900px;height:40px;margin:0 auto;background-color:#CCCC00}  

#top h2{ width:150px;height:40px;background-color:#99CC00;float:left;font-size:14px;text-align:center;line-height:40px;}

#topTags{ width:750px;height:40px;margin:0 auto;background-color:#CCCC00;float:left}

#topTags ul li{ float:left;width:100px;height:25px;margin-right:5px;display:block;text-align:center;cursor:pointer;padding-top:15px;}

#main{ width:900px;height:600px;margin:0 auto;background-color:#F5F7E6;}

#leftMenu{ width:150px;height:600px;background-color:#009900;float:left}

#leftMenu ul{ margin:10px;}

#leftMenu ul li{ width:130px;height:30px;display:block;background:#99CC00;cursor:pointer;line-height:30px;text-align:center;margin-bottom:5px;}

#leftMenu ul li a{ color:#000000;text-decoration:none;display:block;height:100%;

#content{ width:750px;height:600px;float:left}

.content{ width:740px;height:490px;display:none;padding:5px;overflow-y:auto;line-height:30px;}

.content iframe{ width:100%;height:100%}

#footer{ width:900px;height:30px;margin:0 auto;background-color:#ccc;line-height:30px;text-align:center;}

.content1 { width:740px;height:490px;display:block;padding:5px;overflow-y:auto;line-height:30px;}

</style>

<script type="text/javascript">

function show(d1){

    if(document.getElementById(d1).style.display=='block'){

    document.getElementById(d1).style.display='none';  //触动的层如果处于显示状态,即隐藏

  }

  else{

  document.getElementById(d1).style.display='block';  //触动的层如果处于隐藏状态,即显示

}

  }

    window.onload = function () {

        function $(id) { return document.getElementById(id) }

        var menu = $("topTags").getElementsByTagName("ul")[0]; //顶部菜单

        var tags = menu.getElementsByTagName("li"); //顶部菜单•

        var ck = $("leftMenu").getElementsByTagName("ul")[0].getElementsByTagName("li");

        var j;

        //点击左侧菜单增加新标签

        for (i = 0; i < ck.length; i++) {

            ck[i].onclick = function () {

                $("welcome").style.display = "none"////欢迎内容隐藏—

                //循环取得当前索引•

                for (j = 0; j < 8; j++) {

                    if (this == ck[j]) {

                        if ($("p" + j) == null) {

                            openNew(j, this.innerHTML); //设置标签显示文字—

                        }

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值