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 + '%< ...
随机推荐
- inheritPrototypal.js
// 原型式继承 // 其基本思路是借助原型可以基于已有的对象创建新的对象 function object(o){ function F(){} F.prototype = o; return new ...
- web全栈架构师[笔记] — 03 html5新特性
HTML5新特性 一.geolocation PC端 精度比较低 通过IP库定位 移动端 通过GPS window.navigator.geolocation 单次 getCurrentPositio ...
- 外网访问局域网ip的方法
https://jingyan.baidu.com/article/48b558e335e3ac7f39c09a59.html 步骤: 1.浏览器内输入:192.168.1.1进入路由器管理界面 2. ...
- mybatis学习系列四--mybatis generator逆向工程
采用命令行方式执行逆向工程 1.配置文件generatorConfig.xml 保存在目录:D:\E\workspace\eclipse\mybatis_generator <?xmlversi ...
- Websocket通信过程
1. 客户端与服务器建立连接 2. 客户端通过session向服务器发送消息 3. 服务器接收客户端的消息,调用服务器端的onMessage()方法包装.生成消息内容(新的消息包括客户端ID) 4. ...
- centos6分辨率设置
问题描述 centos 6.9最小化安装后, 分辨率会很大, 当然也可以最小化VM虚拟机, 但是有强迫症的朋友可以设置一下. 解决方法 打开/etc/grub.conf配置文件, 在kernel 的最 ...
- python第八十四天---十五周作业
后台管理页面: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- MySQL中MyISAM与InnoDB区别及选择
InnoDB:支持事务处理等不加锁读取支持外键支持行锁不支持FULLTEXT类型的索引不保存表的具体行数,扫描表来计算有多少行DELETE 表时,是一行一行的删除InnoDB 把数据和索引存放在表空间 ...
- webAPi OData的使用
一.OData介绍 开放数据协议(Open Data Protocol,缩写OData)是一种描述如何创建和访问Restful服务的OASIS标准. 二.OData 在asp.net mvc中的用法 ...
- C#语言————第二章 C#语言快速热身
第二章 C#语言快速热身 ***********一.选择结构**************** 1:if选择结构与java的if选择结构语法完全相同 2:switch选择结构 ①:常量表达式的值可 ...