EasyUI panel
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的更多相关文章
- easyUI panel组件
easyUI panel组件: 属性的使用: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- 布局-EasyUI Panel 面板、EasyUI Tabs 标签页/选项卡、EasyUI Accordion 折叠面板、EasyUI Layout 布局
EasyUI Panel 面板 通过 $.fn.panel.defaults 重写默认的 defaults. 面板(panel)当做其他内容的容器使用.它是创建其他组件(比如:Layout 布局.Ta ...
- 修改easyui panel 默认样式
有这么个需求需要修改easyui panel头部中的背景色.于是根据panel中的最终被浏览器解析出来的类名,直接修改这个css样式,设置backgroud-color这个属性,发现不管用. 于是,就 ...
- easyui panel异步获取后台数据在前台显示
我在使用easyui的时候,想做一个向下图所示的效果,这个panel的样式已经做好了,想从后台异步获取json数据,然后填入到文本框中,不知道哪位大神能给点指导?万分感谢! 放入表单中,使用form对 ...
- easyui panel自适应问题
项目中要用到easyui,使用也有几年时间了,刚开始使用还不错,毕竟只是简单的增删改查数据,不过到后面越来越觉得easyui不如extjs了,好多复杂一点的问题,easyui表现就力不从心了,题外话就 ...
- easyui panel自适应浏览器宽度
一.目标效果: 当浏览器窗口大小改变时.panel宽度始终为浏览器宽度的50%,panel高度则根据其中内容的多少而变化,横向竖向滚动条皆不出现.且不需要重新刷新浏览器或者其他js代码 兼容:chro ...
- EasyUI - Panel 面板控件
效果: html代码: <div id="p" style="padding: 10px;"> <p>panel content.< ...
- 2.4 easyui - panel的使用
<div id="p" class="easyui-panel" title="My Panel" style ...
- jquery easyui panel title文字格式设置
$('#txtLeftPercent').panel({ title: '剩余权重:' + '<b style="color:red">' + 100 + '%< ...
随机推荐
- canvas-5Bezier-QuadraticCurveTo.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- virtualenv的使用及pip常用命令
一.virtualenv 1.用途: virtualenv------用来建立一个虚拟的python环境,一个专属于项目的python环境.用virtualenv 来保持一个干净的环境非常有用. 例如 ...
- python之变量与常量
变量:把程序运行过程中产生的值,暂时存储在内存,方便后面的程序调用. 被引号括起来的内容是字符串,原样输出.#单行注释 用来标注代码信息,特点:被注释的内容不会被执行.Ctrl + /'''内容''' ...
- 安装VMwareTool
对于刚刚学习Linux的小白来说,安装VMwareTool工具是一个比较迫切需要,又是些难度的活,下面就做一个简单的介绍. 第一步:点击虚拟机.或者选中需要安装的虚拟机,右键虚拟机,选中安装VMwar ...
- loadrunner 场景设计-添加Unix、Linux Resources计数器
场景设计-添加Unix.Linux Resources计数器 by:授客 QQ:1033553122 A. 目的 监控要测试的Unix.Linux服务器的资源使用情况 Linux CentOS为例 ...
- beego+vue父子组件通信(父子页面传值、父子组件传值、父子路由传值)
场景:有head和foot,为父组件 侧栏tree为子组件 点击tree,右侧孙组件根据点击tree的id,来更改表格内容. 首先是父子(本例中是子组件与孙组件)通信,目前是父传到子,暂时还没有子传到 ...
- MQTT详解以及在IoT中的应用
MQTT定义: MQTT(Message Queuing Telemetry Transport,消息队列遥测传输)是IBM开发的一个即时通讯协议,有可能成为物联网的重要组成部分.该协议支持所有平台, ...
- SDK Manager
dx.bat :将所有的.class文件变成一个.dex文件. aapt:Android Application package tools 安卓应用的打包工具. adb:Android Debug ...
- 使用 WebStorm IDE 调试 Pomelo 应用程序
使用得心应手的IDE来开发应用程序,可以使我们的工作事半功倍.而调试则更可以让我们准确的定位BUG,发现问题.本文讲述如何使用 WebStorm 这个怪兽级JavaScript IDE来调试 Chat ...
- Linux系统将http转为https
想把网站由http访问转变为https访问并没有想象中那么难,网上查了一些资料,想要转为https需要SSL安全证书,这里推荐一款景安网络的证书,可以免费试用一年时间,自己拿来实践还是很不错的选择. ...