easyui课程表案例

最新推荐文章于 2019-08-15 16:28:00 发布
最新推荐文章于 2019-08-15 16:28:00 发布
阅读量565 收藏
点赞数
分类专栏： 网页设计
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36324341/article/details/78603324
版权

easyui课程表案例：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html" charset="UTF-8">
<meta name="keywords" content="jquery,ui,easy,easyui,web">
<meta name="description" content="easyui帮助你容易地构建你的网页">
<title>博野一中课程表</title>
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css">
<script type="text/javascript" src="easyui/jquery.min.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
    <style type="text/css">
        .left{
            width:120px;
            float:left;
        }
        .left table{
            background:#E0ECFF;
        }
        .left td{
            background:#eee;
        }
        .right{
            float:right;
            width:800px;
        }
        .right table{
            background:#E0ECFF;
            width:100%;
        }
        .right td{
            background:#fafafa;
            text-align:center;
            padding:2px;
        }
        .right td{
            background:#E0ECFF;
        }
        .right td.drop{
            background:#fafafa;
            width:100px;
        }
        .right td.over{
            background:#FBEC88;
        }
        .item{
            text-align:center;
            border:1px solid #499B33;
            background:#fafafa;
            width:100px;
        }
        .assigned{
            border:1px solid #BC2A4D;
        }

    </style>
    <script>
        $(function(){
            $('.left .item').draggable({
                revert:true,
                proxy:'clone'
            });
            $('.right td.drop').droppable({
                onDragEnter:function(){
                    $(this).addClass('over');
                },
                onDragLeave:function(){
                    $(this).removeClass('over');
                },
                onDrop:function(e,source){
                    $(this).removeClass('over');
                    if ($(source).hasClass('assigned')){
                        $(this).append(source);
                    } else {
                        var c = $(source).clone().addClass('assigned');
                        $(this).empty().append(c);
                        c.draggable({
                            revert:true
                        });
                    }
                }
            });
        });
    </script>
</head>
<body>
    <h1 align="center">博野一中课程表</h1>
    <div style="width: 100%" align="center"><div style="width: 950px" align="center">
        <div class="left">
            <table>
                <tr>
                    <td><div class="item">英语(English)</div></td>
                </tr>
                <tr>
                    <td><div class="item">科学</div></td>
                </tr>
                <tr>
                    <td><div class="item">音乐</div></td>
                </tr>
                <tr>
                    <td><div class="item">历史</div></td>
                </tr>
                <tr>
                    <td><div class="item">计算机</div></td>
                </tr>
                <tr>
                    <td><div class="item">数学</div></td>
                </tr>
                <tr>
                    <td><div class="item">美术</div></td>
                </tr>
                <tr>
                    <td><div class="item">心理健康教育</div></td>
                </tr>
            </table>
        </div>
        <div class="right">
            <table>
                <tr>
                    <td class="blank"></td>
                    <td class="title">星期一</td>
                    <td class="title">星期二</td>
                    <td class="title">星期三</td>
                    <td class="title">星期四</td>
                    <td class="title">星期五</td>
                    <td class="title">星期六</td>
                    <td class="title">星期日</td>
                </tr>
                <tr>
                    <td class="">08:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">09:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">10:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">11:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">12:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">13:00</td>
                    <td class="lunch" colspan="7">午餐+午休</td>
                </tr>
                <tr>
                    <td class="">14:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">15:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">16:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">17:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">18:00</td>
                    <td class="lunch" colspan="7">晚饭+休息</td>
                </tr>
                <tr>
                    <td class="">19:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">20:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">21:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
                <tr>
                    <td class="">22:00</td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                    <td class="drop"></td>
                </tr>
            </table>
        </div>
    </div>
    </div>
</body>
</html>
阿立聊代码
关注
专栏目录
基于ssm+easyui的管理系统
04-07
本系统采用spring+springmvc+mybatis+easyui搭建的管理系统，功能不多，只实现了登陆注销、用户管理、上传下载文件几个功能。
李炎辉easyui课件以及实例
08-15
1. **EasyUI 框架基础**：了解 EasyUI 的基本结构，包括其核心库 jQuery 和 CSS 样式表，以及如何在项目中引入这些资源。 2. **组件使用**：通过课件，学习者将接触到各种 EasyUI 组件，如 Dialog（对话框）、Menu...
08EasyUI 拖放- 创建学校课程表
阿甘兄
04-17 503
我们将创建两个表格：在左侧显示学校科目，在右侧显示时间表。 您可以拖动学校科目并放置到时间表单元格上。 学校科目是一个<div class="item"> 元素，时间表单元格是一个 元素,如下图： 显示学校科目 <div class="left"> <table> <tr> ...
使用easyUI创建一个课程表
YHC
08-08 2788
@author YHC 这个教程将向你展示使用jQuery EasyUI如何创建一个课程表,我们将创建两个table:学校科目在左边时间表在右边,你可以拖动学校科目和放置到时间表表格中 学校科目是一个<div class="item">元素然而时间表表格是一个元素. 查看Demo 显示 学校科目 E
easyUI的课程表练习
qq_35437583的博客
07-31 568
初入公司，经过简单培训，现要求我们自己动手实现课程表的查询，以easyUI+springMVC+hibernate，为框架基础。笔者数据库使用的是oracle。![实现结果如下](http://img.blog.csdn.net/20170731164840502?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcXFfMzU0Mzc1ODM=/font/5
jqueryeasyUI(5 创建课程表)
Hero_孙的博客
08-17 1113
课程表代码 &lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt; &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/
easyui+springMVC+hibernate练习
07-31
本项目名为“easyui+springMVC+hibernate练习”，旨在通过整合这三大技术，实现一个实用的课程表功能。下面将详细阐述这三个技术及其在项目中的作用。 1. EasyUI： EasyUI是一款基于jQuery的前端框架，它提供了丰富...
jQuery EasyUI
08-04
- **创建学校课程表**：通过拖拽可以调整课程的时间安排。 **3. 菜单与按钮(Menu & Button)** - **创建简单的菜单**：EasyUI 提供了多种菜单样式，如上下文菜单、下拉菜单等。 - **创建链接按钮(LinkButton)**：...
jQuery_EasyUI教程.doc
06-04
为了创建课程表，教程可能会讲解如何使用 easyui 的 panel、datagrid 或者 schedule 组件来展示课程信息。显示课程部分会涉及如何加载和格式化课程数据，而显示时间表则会介绍如何组织和布局时间单元格。此外，拖动...
基于Springmvc+MyBatis+Spring+EasyUI+Mysql的项目申报及评审系统.zip
04-04
在研究过程中，学生可能需要采用各种研究方法，如实验、调查、案例分析等，以获取必要的数据和信息。通过这些活动，学生能够培养扎实的专业技能，提升解决实际问题的实际能力。 第三，毕业设计的撰写是整个过程的...
SSM+easyUI框架实现的对学生的增删改查
04-22
后端采用SSM框架，前端采用EasyUI框架，功能完善，包含数据库文件，导入即可使用 MySQL56+Tomcat8+Myeclipse2017+Spring4.1，良心之作，所以收两分，如有不明白可以加QQ 1032089468进行咨询
大学课表管理系统
12-09
教学秘书输入教师代课信息和班级上课信息，并进行自动排课 教师可以预先在网上提交对上课时间、地点的特殊要求，排课后可 以查看自己所带课程信息排课后学生可以看自己所上课程信息
雷林鹏分享：jQuery EasyUI 拖放 - 创建学校课程表
weixin_30843605的博客
08-15 227
　　本教程将向您展示如何使用 jQuery EasyUI 创建一个学校课程表。 我们将创建两个表格：在左侧显示学校科目，在右侧显示时间表。 您可以拖动学校科目并放置到时间表单元格上。 学校科目是一个 元素，时间表单元格是一个 元素。 　　显示学校科目 　　 　　 　　 　　 　　 　　 　　 　　 　　 ...
jQuery EasyUI使用教程之创建一个课程表
需要界面开发、IDE工具研发中文教程资料的小伙伴，记得私信我~
10-09 1967
jQuery EasyUI最新版下载> 本教程将为你展示如何使用jQuery EasyUI创建一个学校的课程表。我们将创建两个表：学校的科目在左边，时间表在右边，你可以拖动学校科目并将其放在时间表的单元格中。学校的科目是一个"div class='item'"元素，然而时间表单元格是一个"td class='drop'"元素。 查看演示 显示学校科目
jQuery easyUI动态的课表
QQ873963142的博客
03-15 1814
draggable拖拽和droppable放置 建议用IE或火狐浏览器，亲测！ jQuery EasyUI Demo .left{ width:120px; float:left; } .left table{ background:#E0ECFF; } .left td{ background:#eee; }
easyUi的简单增删改查案例
热门推荐
大表哥
12-16 1万+
使用easyUI 需要下载easyui的资源包 并解压  把解压后的文件找到如下图的资源并复制 并在head标签中引入如下   &lt;link rel="stylesheet" type="text/css" href="themes/default/easyui.css"&gt; &lt;link rel="stylesheet" type="text/css" hre
easyUI按钮图表对照大全
weixin_30393907的博客
02-12 199
easyUI图标与对照类的对应关系： 转载于:https://www.cnblogs.com/whalesea/p/10366149.html
两小时手写springmvc框架
feinifi的博客
08-15 4060
这篇文章是学习咕泡学院tom老师手写一个spring框架视频而来，代码基本复制原文，稍作修改。可以帮助我们理解springmvc实现的大致原理。 1、构建maven工程，只需要导入javax.servlet-api的依赖。另外配置，直接通过tomcat插件来启动项目。 &lt;dependencies&gt; &lt;dependency&gt; &lt;groupI...
【高创新】基于鲸鱼优化算法WOA-Transformer-LSTM实现故障识别Matlab实现.rar
最新发布
09-18
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 替换数据可以直接使用，注释清楚，适合新手
jquery easyui 案例 下载
07-31
jquery easyui 是一个轻量级、开源的前端框架，提供了丰富的UI组件和简单易用的API，使开发人员能够快速构建用户界面。它可以用于开发各种Web应用程序，包括管理系统、数据报表、表单验证等。 要下载jquery easyui...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

阿立聊代码

有作用的，有闲钱的支持一点。

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值