<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Custom Window Tools - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Custom Window Tools</h2>
<p>Click the right top buttons to perform actions.</p>
<div style="margin:20px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('open')">Open</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#w').window('close')">Close</a>
</div>
<div id="w" class="easyui-window" title="Custom Window Tools" data-options="iconCls:'icon-save',minimizable:false,tools:'#tt'" style="width:500px;height:200px;padding:10px;">
The window content.
</div>
<div id="tt"> // ajax shixian
<a href="javascript:void(0)" class="icon-add" onclick="javascript:alert('add')"></a>
<a href="javascript:void(0)" class="icon-edit" onclick="javascript:alert('edit')"></a>
<a href="javascript:void(0)" class="icon-cut" onclick="javascript:alert('cut')"></a>
<a href="javascript:void(0)" class="icon-help" onclick="javascript:alert('help')"></a>
</div> </body>
</html>

实例:

jquery easy ui 学习 (2) customtools window的更多相关文章

  1. jquery easy ui 学习 (4) window 打开之后 限制操纵后面元素属性

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. jquery easy ui 学习 (3) window 限制在父类窗体内

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. jquery easy ui 学习 (1)Basic Window

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. jquery easy ui 学习 (6) basic validatebox

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. jquery easy ui 学习 (5) windowlayout

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. jquery easy ui 学习 (9)Pagination in TreeGrid 分页

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. jquery easy ui 学习 (8)basic treegrid

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. jquery easy ui 学习 (7) TreeGrid Actions

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. Jquery easy UI 上中下三栏布局 分类: ASP.NET 2015-02-06 09:19 368人阅读 评论(0) 收藏

    效果图: 源代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

随机推荐

  1. firefox HackBar组件模拟请求POST请求

    组件下载地址:https://addons.mozilla.org/zh-CN/firefox/addon/hackbar/

  2. bzoj 1089 [SCOI2003]严格n元树(DP+高精度)

    1089: [SCOI2003]严格n元树 Time Limit: 1 Sec  Memory Limit: 162 MBSubmit: 1250  Solved: 621[Submit][Statu ...

  3. C++程序原码

    直接插入排序基本算法 #include<iostream.h> #include<stdlib.h> #include<time.h> const int n=10 ...

  4. Chrome启动参数的配置问题的补充

    一.当Chrome浏览器不支持本地AJAX请求时,会出现AJAX跨域问题,这时候我们就要配置相应的启动参数使得浏览器可以访问本地文件: 配置参数为:--allow-file-access-from-f ...

  5. angularJS 服务三

    路由 一 简介 1.路由机制 为了实现无刷新的视图切换,我们通常会用ajax请求从后台取数据,然后套上HTML模板渲染在页面上,然而ajax的一个致命缺点就是导致浏览器后退按钮失效,尽管我们可以在页面 ...

  6. Unable to locate the Javac Compiler 解决办法

    在使用eclipse对maven项目进行编译打包(Run As->Maven install)时,报以下错误:[ERROR] Failed to execute goal org.apache. ...

  7. 系统自带.net版本

    首先我们可以参照下面的图来得到各Windows系统包括server版的自带.NET Framework的信息,下图只列出了.NET Framework 2.0及其之后的版本. Which Versio ...

  8. iOS异步图片加载优化与常用开源库分析

    网络图片显示大体步骤: 1.下载图片: 2.图片处理(裁剪,边框等): 3.写入磁盘: 4.从磁盘读取数据到内核缓冲区: 5.从内核缓冲区复制到用户空间(内存级别拷贝): 6.解压缩为位图(耗cpu较 ...

  9. npm scripts 助力前端开发,实时刷新浏览器

    用browser-sync或者lite-server来监控文件的改变,当文件改变时,就自动刷新浏览器. 用node-sass来实时编译scss文件. 用parallelshell来异步执行npm sc ...

  10. android核心服务初探

    终于进入android学习的进阶阶段,第一个课题是android的核心服务.首先,让我们来认识一下核心服务. android核心服务与app服务有所区别.app服务继承自Service基类,在app运 ...