1.脚本生成panel

2.panel属性

3.panel事件

4.panel方法

一 脚本生成panel

  <div id="tt"></div>
<script>
$(function () {
$('#tt').panel({
width: '100%',
height: '200'
});
});

二 panel属性

参考:http://www.jeasyui.net/plugins/159.html

 $(function () {
$('#tt').panel({
width: '100%',
height: '200',
fit: true, //适应父容器大小
border: false,//不显示边框
minimizable: true,
maximizable: true,
closable: true,
collapsible: true,
title: 'My Panel',
href: 'WebForm1.aspx',
onLoad: function () { },
tools: [{
iconCls: 'icon-add',
handler: function () { alert('new') }
}, {
iconCls: 'icon-save',
handler: function () { alert('save') }
}]
});
});

三 panel 事件

例如:onLoad  onOpen,还有其他事件,参考官网注解

 $(function () {
$('#tt').panel({
width: '100%',
height: '200',
fit: true, //适应父容器大小
border: false,//不显示边框
minimizable: true,
maximizable: true,
closable: true,
collapsible: true,
title: 'My Panel',
href: 'WebForm1.aspx',
onLoad: function () { },
onOpen: function () { },
tools: [{
iconCls: 'icon-add',
handler: function () { alert('new') }
}, {
iconCls: 'icon-save',
handler: function () { alert('save') }
}]
});
});

四 panel 方法

$("#tt").panel("open");
$("#tt").panel("close");
$("#tt").panel("refresh"); //刷新内容,当href有值时,页面重新加载
$("#tt").panel("maximize"); //最大化
$("#tt").panel("minimize"); //最小化

EasyUI panel的更多相关文章

  1. easyUI panel组件

    easyUI panel组件: 属性的使用: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  2. 布局-EasyUI Panel 面板、EasyUI Tabs 标签页/选项卡、EasyUI Accordion 折叠面板、EasyUI Layout 布局

    EasyUI Panel 面板 通过 $.fn.panel.defaults 重写默认的 defaults. 面板(panel)当做其他内容的容器使用.它是创建其他组件(比如:Layout 布局.Ta ...

  3. 修改easyui panel 默认样式

    有这么个需求需要修改easyui panel头部中的背景色.于是根据panel中的最终被浏览器解析出来的类名,直接修改这个css样式,设置backgroud-color这个属性,发现不管用. 于是,就 ...

  4. easyui panel异步获取后台数据在前台显示

    我在使用easyui的时候,想做一个向下图所示的效果,这个panel的样式已经做好了,想从后台异步获取json数据,然后填入到文本框中,不知道哪位大神能给点指导?万分感谢! 放入表单中,使用form对 ...

  5. easyui panel自适应问题

    项目中要用到easyui,使用也有几年时间了,刚开始使用还不错,毕竟只是简单的增删改查数据,不过到后面越来越觉得easyui不如extjs了,好多复杂一点的问题,easyui表现就力不从心了,题外话就 ...

  6. easyui panel自适应浏览器宽度

    一.目标效果: 当浏览器窗口大小改变时.panel宽度始终为浏览器宽度的50%,panel高度则根据其中内容的多少而变化,横向竖向滚动条皆不出现.且不需要重新刷新浏览器或者其他js代码 兼容:chro ...

  7. EasyUI - Panel 面板控件

    效果: html代码: <div id="p" style="padding: 10px;"> <p>panel content.< ...

  8. 2.4 easyui - panel的使用

    <div id="p" class="easyui-panel" title="My Panel"             style ...

  9. jquery easyui panel title文字格式设置

    $('#txtLeftPercent').panel({ title: '剩余权重:' + '<b style="color:red">' + 100 + '%< ...

随机推荐

  1. SpringBoot与Cloud版本匹配问题

    在使用SpringCloud的时候需要在SpringBoot工程的pom.xml中引入 <dependencyManagement> <dependencies> <de ...

  2. lfs(systemd版本)学习笔记-第2页

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! lfs(systemd)学习笔记-第1页 的地址:https://www.cnblogs.com/renren-study-no ...

  3. [简记] github 上的 GraphQL v4 API

    突发奇想,想用github做一个支持rss的blog体系,或者就是知识管理体系,简单看了下,把测试用的暂存起来 # Type queries into this side of the screen, ...

  4. element UI实现表格中添加开关控制按钮

    我使用的是element ui V1.4.3 如下图是我要实现的效果: <template> <div> <el-button type="text" ...

  5. 【代码笔记】Web-JavaScript-JavaScript语句

    一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  6. 元素的class和id问题

    一个元素有且只能有1个id,且全文中此id只能出现在一个元素上   一个元素不能写多次class,比如 <div class="a" class="b"& ...

  7. IDEA项目搭建八——使用MybatisPlus简化数据库交互

    一.MybatisPlus简化数据库交互 我们使用Mybatis发现需要在mapper.xml中写很多重复的简单CRUD(增删改查),使用MybatisPlus可以大大简化这部分代码,官方文档http ...

  8. CentOS7.4 系统下 Tomcat 启动慢解决方法

    CentOS7.4 系统下 Tomcat 启动慢解决的方法   首先查看日志信息,查看因为什么而启动慢 在CentOS7启动Tomcat时,启动过程很慢,需要几分钟,经过查看日志,发现耗时在这里:是s ...

  9. 关于Android studio的安装和配置问题

    一.Android studio的安装 我们可以从中文社区http://www.android-studio.org/下载Android studio最新版本,然后点击安装即可. 之后我们直接运行an ...

  10. 【Java入门提高篇】Day21 Java容器类详解(四)ArrayList源码分析

    今天要介绍的是List接口中最常用的实现类——ArrayList,本篇的源码分析基于JDK8,如果有不一致的地方,可先切换到JDK8后再进行操作. 本篇的内容主要包括这几块: 1.源码结构介绍 2.源 ...