[刘阳Java]_easyui-panel组件入门级_第3讲

EasyUI中的panel组件在前面一节中我们简单告诉了大家代码如何写。这一节我们会从panel的入门级开始讲起走,重点包括它的事件监听,属性tool介绍

1. 事件监听-通过data-options方式实现

<div class=”easyui-panel” data-options=”width…..” data-options=”onCollapse:function() {console.log(‘Hello Wrold’);}”>

2. 事件监听-通过JS创建组件并定义事件监听

<script type="text/javascript">
    $(function() {
        $("#d01").panel({
            width: 500,
            height: 200,
            iconCls: ‘icon-save‘,
            collapsible: true,
            title: ‘我的面板‘,
            onCollapse: function() {
                console.log(‘Hello World‘);
            }
        });

    });
</script>

<div id="d01">
    我的第一个easyui程序
</div>

3. easyui-panel组件扩展,主要使用tools

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<!--
1.引入jquery.min.js
2.引入jquery.easyui.min.js
3.引入jqueryeasyui的css
4.引入国际化资源文件

EasyUI创建组件有两种方式
1.html方式创建(推荐使用data-options方式来添加组件属性, data-options方式是html5)
2.js方式创建, 属性的添加是一种json格式风格
 -->
<script type="text/javascript" src="../easyui/jquery.min.js"></script>
<script type="text/javascript" src="../easyui/jquery.easyui.min.js"></script>
<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/locale/easyui-lang-zh_CN.js"></script>
</head>
<body>
<div class="easyui-panel" style="width:500px;height:200px;padding:10px;" data-options="iconCls:‘icon-save‘,collapsible:true,title:‘我的面板‘,tools:‘#tt‘">
    我的第一个easyui程序
</div>
<div id="tt">
    <a href="#" class="icon-add" onclick="javascript:alert(‘icon-add‘);"></a>
    <a href="#" class="icon-edit" onclick="javascript:alert(‘icon-edit‘);"></a>
</div>
</body>
</html>
时间: 2024-11-01 13:45:12

[刘阳Java]_easyui-panel组件入门级_第3讲的相关文章

[刘阳Java]_SpringMVC方法静态资源_第9讲

有些时候我们在使用SpringMVC的时候造成无法访问静态资源文件(如:html,js,css,image等等).其主要的原因出在web.xml文件我们设置SpringMVC前端控制器的映射路径 <servlet> <servlet-name>spmvc</servlet-name> <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class> &

[刘阳Java]_Spring常用注解介绍_第6讲

Spring的注解是在Spring2.5的版本中引入的,目的简化XML配置.在企业开发过程中使用注解的频率非常高,但是学习注解的前提是大家一定要对Spring基于XML配置要熟悉,这是我个人建议,因为在Spring2.0的版本时候是没有出现注解的使用 1. Spring常用注解如下 @Component @Autowired @Qualifier @Scope @Controller @Service @Repository 2. 使用Spring注解的时候一定关注Spring框架需要加入的包[

[刘阳Java]_Spring相关配置介绍_第5讲

这一节我们介绍一下Spring框架的相关常用配置 Spring依赖注入的两种方式(构造方法注入和setter方式注入) p-namespace方式配置 properties属性文件配置方式 集合对象配置方式 Bean scopes作用域(单例作用域和原生作用域) 1. Spring依赖注入方式 构造方法注入,它相当于在Spring初始化对象的时候调用构造方法将其对象之间的依赖关系给注入到对象中 先在类中定义好依赖对象 再去定义构造方法,通过在构造方法的参数中设置对象的依赖关系 最后在Spring

[刘阳Java]_InternalResourceViewResolver视图解析器_第6讲

SpringMVC在处理器方法中通常返回的是逻辑视图,如何定位到真正的页面,就需要通过视图解析器 InternalResourceViewResolver是SpringMVC中比较常用视图解析器. 网上有一篇文章写得不错,我们也推荐大家去看看,当然要谢谢这篇博客提供的内容,转发地址:http://www.cnblogs.com/liruiloveparents/p/5054605.html 1. InternalResourceViewResolver的配置文件代码如下 <?xml versio

[刘阳Java]_eayui-searchbox搜索组件_第6讲

EasyUI中搜索框也是常用的基本组件,可以用到条件搜索中 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <!-- 1.引入jquery.min.js 2.引入jquery.easyui.min.js 3.引入jqueryeasyui的css 4.引入国际化资源文件 EasyUI创建组

[刘阳Java]_什么是EasyUI_第1讲

jQuery EasyUI在Java后台开发中用得还是比较多.当然客观来讲虽然前端技术的发展,很多后台界面设计都植入了前端技术的框架.但是这篇文章我个人觉得也不会妨碍我们对jQuery EasyUI的学习 1.什么是EasyUI框架 它是一组基于jQuery的UI插件集合,而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面 2.EasyUI更加直观的认识 3.怎么学习EasyUI,它有哪些重点的内容呢 Base(基础组件):基础组件是带领大家对jQue

[刘阳Java]_SpringMVC与Struts2的对比_第12讲

今日来具体给讲讲SpringMVC与Struts2的对比,这样方便朋友们在工作中或者是面试学习中对这两者的区别有个更好的了解 把这张图放在这里,我是想说SpringMVC和Struts2真的是不一样的,虽然在都有着核心分发器等相同的功能组件(这些由MVC模式本身决定的) 为什么SpringMVC会赢得最后的胜利呢?谈几点我自己的看法: 第一.MVC框架的出现是为了将URL从HTTP的世界中映射到Java世界中,这是MVC框架的核心功能.而在URL这一点SpringMVC无疑更加优雅. 第二.从设

[刘阳Java]_Spring AOP基于XML配置介绍_第9讲

基于注解配置的Spring AOP固然简单,但是这节我们会给大家介绍基于XML配置的AOP是如何应用的.为什么这么说了,因为后面我们还会介绍到Spring对Dao操作的事务管理(基于AOP的XML文件方式来配置事务) 1. 基于XML文件方式来配置Spring的AOP,则我们需要的一些基本元素如下 <aop:config.../>,此标签很重要.它是在XML里配置AOP功能的核心标签 all aspect and advisor elements must be placed within a

[刘阳Java]_Spring入门_第1讲

Spring框架在企业中的使用非常多,优势明显.所以学好Spring框架肯定不言而喻.今天我们给大家介绍Spring的入门 1. 对于初学者来说我们要学习Spring框架中的哪些技术,这个有必要了解一下 Spring中的IOC Spring中的AOP Spring是如何对Dao层进行封装的 Spring对Java Web的技术支持 Spring配置文件中的各类标签元素的应用 Spring的注解 Spring的事务管理机制 Spring自身的MVC框架是如何应用的 2. 我们先不要去讲Spring