最全面实例丰富EasyUI最新官方培训版教程

这个教程的目的是说明如何使用easyui框架容易的创建网页。首先，你需要包含一些js和css文件： <link rel="stylesheet" type="text/css" href="../themes/default/easyui.css"> <script type="text/javascript" src="../jquery-1.4.2.min.js"></script> <script type="text/javascript" src="../jquery.easyui.min.js"></script> easyui预定义了一些图标css，这些css类可以显示图片背景（16×16）。使用这些类之前，需要包含： <link rel="stylesheet" type="text/css" href="../themes/icon.css"> 内容 1. 拖放 o 基本拖放 o 创建购物车式拖放 o 创建课程表 基本拖放 这个教程显示如何使HTML元素变得可拖放。这个例子会创建3个DIV元素然后让它们变得可拖放。 首先，创建三个DIV元素： <div id="dd1" class="dd-demo"></div> <div id="dd2" class="dd-demo"></div> <div id="dd3" class="dd-demo"></div> 让第一个DIV元素可拖放，使用默认的拖放样式。 $('#dd1').draggable(); 让第二个DIV元素使用proxy来拖放，proxy:'clone'表示proxy使用原始元素的复制。 $('#dd2').draggable({ proxy:'clone' }); 让第三个DIV元素使用自定义proxy来拖放 $('#dd3').draggable({ proxy:function(source){ var p = $('<div class="proxy">proxy</div>'); p.appendTo('body'); return p; } }); 构建购物车型拖放 使用jQuery easyui，我们在web应用中就有了拖放的能力。这个教程显示了如何构建购物车页，它使用户拖放他们希望购买的产品，更新购物篮的物品和价格。