项目情况:

  主页面用引用了公共头文件(包含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加载类似)的更多相关文章

  1. jQuery Mobile 手动显示ajax加载器,提示加载中...

    在使用jQuery Mobile开发时,有时候我们需要在请求ajax期间,显示加载提示框(例如:一个旋转图片+一个提示:加载中...).这个时候,我们可以手动显示jQuery Mobile的加载器,大 ...

  2. jQuery Mobile 手动显示ajax加载器

    在jquery mobile开发中,经常需要调用ajax方法,异步获取数据,如果异步获取数据方法由于网速等等的原因,会有一个反应时间,如果能在点击按钮后数据处理期间,给一个正在加载的提示,客户体验会更 ...

  3. jQuery瀑布流从不同方向加载3种效果演示

    很实用的一款插件jQuery瀑布流从不同方向加载3种效果演示在线预览 下载地址 实例代码 <section class="grid-wrap"> <ul clas ...

  4. jquery easyui easyui-treegrid 使用异步加载数据

    jquery easyui easyui-treegrid 使用异步加载数据 jquery easyui easyui-treegrid 异步请求 >>>>>>&g ...

  5. JQuery浮动层Loading页面加载特效

    之前做项目,经常需要一些浮动层加载Loading. 现在好多前端框架都能实现了,最常用的就是 artDialog 下面记录下当时的代码. <!DOCTYPE html PUBLIC " ...

  6. 转载:用Jquery实现的图片预加载技术,可以实现有序加载和无序加载!

    一.背景 我们在做页面的时候,从用户体验的角度出发,肯定是希望用户以最快的速度看到完整的页面信息,但在实际情况中经常会遇到些问题. 比如受网速影响,页面加载素材的时间比较长,页面会出现短时间的错乱或者 ...

  7. [转]jquery的ajax交付时“加载中”提示的处理方法

    本文转自:http://www.educity.cn/wenda/77121.html jquery的ajax提交时“加载中”提示的处理方法    方法1:使用ajaxStart方法定义一个全局的“加 ...

  8. jquery.lazyload (JS懒加载框架使用详解)

    /** 本地加载方式加载JS*/        NSString *path = [[NSBundle mainBundle] pathForResource:@"jquery.js&quo ...

  9. 《前端之路》之 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏

    目录 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & ...

  10. WebView 加载网页 加载资源 总结 MD

    Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...

随机推荐

  1. UVA548

    题意: 根据二叉树中序和后序建立二叉树,从根结点开始计算和到叶子结点,输出总和最小的叶子结点,如果有俩个和一样大,输出叶子结点最小的 AC:80ms #include<stdio.h> # ...

  2. OpenACC 与 CUDA 的相互调用

    ▶ 按照书上的代码完成了 OpenACC 与CUDA 的相互调用,以及 OpenACC 调用 cuBLAS.便于过程遇到了很多问题,注入 CUDA 版本,代码版本,计算能力指定等,先放在这里,以后填坑 ...

  3. jmap Exception in thread "main" java.io.IOException: 拒绝访问。

    环境: 现有一个独立运行的系统S(有独立的jre,但是没jdk),现想通过jmap导出其内存堆栈信息.于是另外安装一个jdk.可是jdk的版本跟S系统的jre不能对应上.出了很多错误. 总是报错: C ...

  4. Reactjs 打包后 Tomcat 部署 404问题

    配置web.xml <error-page> <error-code>404</error-code> <location>/index.html< ...

  5. MYSQL查询优化:show profile

    为避免之前已经把 SQL 存放在 QCACHE 中, 建议在执行 SQL 时, 强制 SELECT 语句不进行 QCACHE 检测.这样可以提交分析的准确性 mysql> select sql_ ...

  6. VNC连接黑屏的问题

    今天尝试在CentOS上安装一个VNC Server.CentOS5 已经自带了VNC,默认也已经安装了,只要配置一下就可以了(如果没有安装,可以:yum install vnc vncserver安 ...

  7. js函数中变量声明提前

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

  8. php ip2long 负数问题

    官方网站: Note: 因为PHP的 integer 类型是有符号,并且有许多的IP地址讲导致在32位系统的情况下为负数, 你需要使用 "%u" 进行转换通过 sprintf()  ...

  9. window 下复制 cmd内容

    https://www.microsoft.com/resources/documentation/windows/xp/all/proddocs/en-us/windows_dos_copy.msp ...

  10. 大型运输行业实战_day03_1_基于intellij idea的非maven spring+springMVC+mybatis搭建

    1.搭建标准web项目结构 搭建完成后的项目结构如图 1.创建普通web项目(略) 2.在lib中添加jar包 3.在resources中添加spring-config.xml主配置文件 <?x ...