世纪之光
世纪之光

浅析jQuery EasyUI响应式布局的实现方案

首先解释一下本篇文章标题中提到的“jQuery EasyUI响应式布局”，这里是指EasyUI里布局类组件的fit属性，也就是实现自适应的属性。到了1.4版本，新增了一个宽度百分比的概念，既可以用在布局类组件上，也可用在表单类组件上，但是其实现方案跟fit是类似的。

也就是说，jQuery EasyUI的自适应布局包含两块内容：

  • 布局类和表格类组件的fit属性设置为true，也就是宽度和高度都100%；
  • 布局类组件，表格类组件和表单类组件的宽度设置为百分比；

因为EasyUI比较复杂的DOM结构设计，导致响应式布局无法使用css里原生的百分比去实现，通常宿主DOM，都会被包装得面目全非。最后组件呈现的时候，全部是以具体的像素值显示的。

拿 1.4版本的代码来做分析，我们看看EasyUI的fluid神秘面纱后的逻辑到底是个什么样的？特别是组件多层嵌套的时候，它是如何做到每个组件都能自适应的。

追本溯源

先来追本溯源，fluid的本质是浏览器窗口调整大小的时候，页面的布局能相应的做调整，而在这个过程中，唯一能利用的事件是window的resize，所以EasyUI响应式布局的实现，一定是在window的resize事件中处理的。

我们在源码中搜索"$(window)"关键字，共搜索到20个左右，但是跟resize事件相关的只有两个地方。一个是panel组件里绑定的resize；另一个是window组件里绑定的resize事件。

window组件绑定的resize

为什么要把window组件放到前面看？那是因为window组件里绑定的resize跟fluid实在没什么关系，来看代码：

  1. $(window).resize(function () {
  2.         $("body>div.window-mask").css({width: $(window)._outerWidth(), height: $(window)._outerHeight()});
  3.         setTimeout(function () {
  4.             $("body>div.window-mask").css({width: _26d().width, height: _26d().height});
  5.         }, 50);
  6.     });

这个事件处理程序，像个一丝不挂的普通姑娘，没啥内涵，目的单纯而直白——只是为了实时调整window组件的蒙版大小，他的功能相对于fluid来讲实在微不足道，所以我们一眼嫖过去，不做过多讨论。

panel组件绑定的resize

panel组件绑定的resize事件处理程序是相当有内涵的，她绝对不是一丝不挂，而且穿了好几层情趣内衣，我们需要一层一层的扒，需要耐心。先来看事件处理程序的定义：

  1. // 定义的了一个定时器的引用，老鸟们应该都知道他的目的有两个
  2. // 一是防止短时间内多次触发window的resize事件处理程序；
  3. // 二是解决某些浏览器调整一次窗口却多次触发resize事件的问题
  4. var _23f = null;
  5. $(window).unbind(".panel").bind("resize.panel", function () {
  6.     // 100ms内触发多次的话，则终止对前一次的事件处理程序的调用
  7.     if (_23f) {
  8.         clearTimeout(_23f);
  9.     }
  10.     // 重置定时器
  11.     _23f = setTimeout(function () {
  12.         // 这里主要是看body是否是一个layout实例(是layout的话，body元素上会有layout样式)
  13.         var _240 = $("body.layout");
  14.         // 如果body是一个layout，则调用layout的resize方法，
  15.         // layout的resize方法最终调用的也是panel的resize方法
  16.         // 所以layout的resize显然是个多层情趣内裤，我们不急着扒。
  17.         if (_240.length) {
  18.             _240.layout("resize");
  19.         } else {
  20.             // 如果body不是一个layout组件，则调用panel组件的doLayout方法
  21.             // 这个层数应该少点，而且地处核心位置，我们先扒这个doLayout
  22.             $("body").panel("doLayout");
  23.         }
  24.         // 清空定时器
  25.         _23f = null;
  26.     }, 100);
  27. });

当我们的页面上引用了jquery.easyui.min.js这个伪开源的文件之后，这段代码会被执行一次。这段代码虽然不长，但是里面调用了resize和doLayout方法。

layout的resize方法，其底层调用的是panel的reszie方法(这层内衣我迅速的扒了，不信的同学可以自己看layout的代码)。所以，最后的焦点全部落到panel组件的两个方法上： doLayout和resize。

doLayout方法

找到panel组件的doLayout代码(搜"doLayout"关键字即可)：

  1. function doLayout (jq, all) {
  2.     return jq.each(function () {
  3.         // 缓存this
  4.         var _24a = this;
  5.         // _24b变量判断当前容器是不是body
  6.         var _24b = _24a == $("body")[0];
  7.         // find函数的选择器真的很长，最后还用了filter方法来进一步过滤find出来结果
  8.         // 这个写法看起来似乎很简洁明了，但是，他是否高效呢？这个问题先放一放
  9.         // 我们先弄清楚这个变量s到底是什么？这个必须要拿例子来说明，注释里我试了很多方式去表达，都觉得表达不清楚。
  10.         var s = $(this).find("div.panel:visible,div.accordion:visible,div.tabs-container:visible,div.layout:visible,.easyui-fluid:visible").filter(function (_24c, el) {
  11.             var p = $(el).parents("div.panel-body:first");
  12.             if (_24b) {
  13.                 return p.length == 0;
  14.             } else {
  15.                 return p[0] == _24a;
  16.             }
  17.         });
  18.         // 找到的需要做fluid布局后，触发绑定在他们DOM上自定义的的"_reszie"事件
  19.         s.trigger("_resize", [all || false]);
  20.     });
  21. }

对于doLayout函数中的s变量，分两种情况举例子。

如果当前容器是body：

  1. <!-- 当前容器 -->
  2. <body>
  3.     <div id="a1">
  4.         <div id="a21" class="accordion">
  5.             <div id="a3">
  6.                 <div id="a4" class="accordion">...</div>
  7.             </div>
  8.         </div>
  9.         <div id="a22" class="accordion">...</div>
  10.     </div>
  11. </body>

s只包含"a21"和 "a22",其实也就是离当前容器最近的包含特征样式的子孙级元素。

如果当前元素是div.panel-body:

  1. <div class="panel-body">
  2.     <div id="a1">
  3.         <div id="a21" class="accordion">
  4.             <div id="a3">
  5.                 <div id="a4" class="accordion">...</div>
  6.             </div>
  7.         </div>
  8.         <div id="a22" class="accordion">...</div>
  9.     </div>
  10. </div>

s也只包含"a21"和 "a22"，跟body情况是一样的，只是寻找方式不一样。

这个doLayout函数的目的就比较清楚了： 它负责寻找当前容器的下一级(不一定是子级别，也可能是孙子，重孙子等)需要做响应式布局的组件，然后触发绑定在这些组件上自定义的"_reszie"事件。

由此，我们也可以推断： 每一个含有响应式特性的组件，其DOM结构里面肯定存在一个绑定了自定义的"_resize"事件的事件处理程序。

到这里， “下一级需要做响应式布局的组件”完成了自适应，那么 “下下级需要做响应式布局的组件”(响应式组件多层嵌套)是怎么完成自适应的呢？。

不急，我们还是拿panel组件自定义的"_resize"来看：

  1. function _13(_14) {
  2.     $(_14).addClass("panel-body")._size("clear");
  3.     var _15 = $("<div class=\"panel\"></div>").insertBefore(_14);
  4.     _15[0].appendChild(_14);
  5.     _15.bind("_resize", function (e, _16) {
  6.         if ($(this).hasClass("easyui-fluid") || _16) {
  7.             // _3函数就是panel组件resize方法的实现
  8.             _3(_14);
  9.         }
  10.         return false;
  11.     });
  12.     return _15;
  13. };

也就是说自定义的"_resize"事件处理程序里，调用组件自身的resize方法，看来想知道“下下级”的响应式布局是如何完成的，必须还是去问resize方法。

resize方法

我们直接看代码：

  1. // panel组件resize方法的实现
  2. function _3(_4, _5) {
  3.     var _6 = $.data(_4, "panel");
  4.     var _7 = _6.options;
  5.     var _8 = _6.panel;
  6.     var _9 = _8.children("div.panel-header");
  7.     var _a = _8.children("div.panel-body");
  8.     if (_5) {
  9.         $.extend(_7, {width: _5.width, height: _5.height, minWidth: _5.minWidth, maxWidth: _5.maxWidth, minHeight: _5.minHeight, maxHeight: _5.maxHeight, left: _5.left, top: _5.top});
  10.     }
  11.     _8._size(_7);
  12.     _9.add(_a)._outerWidth(_8.width());
  13.     if (!isNaN(parseInt(_7.height))) {
  14.         _a._outerHeight(_8.height() - _9._outerHeight());
  15.     } else {
  16.         _a.css("height", "");
  17.         var _b = $.parser.parseValue("minHeight", _7.minHeight, _8.parent());
  18.         var _c = $.parser.parseValue("maxHeight", _7.maxHeight, _8.parent());
  19.         var _d = _9._outerHeight() + _8._outerHeight() - _8.height();
  20.         _a._size("minHeight", _b ? (_b - _d) : "");
  21.         _a._size("maxHeight", _c ? (_c - _d) : "");
  22.     }
  23.     _8.css({height: "", minHeight: "", maxHeight: "", left: _7.left, top: _7.top});
  24.     _7.onResize.apply(_4, [_7.width, _7.height]);
  25.     // 关键代码只有这一行，瞧，它又调用了panel组件的doLayout方法!
  26.     $(_4).panel("doLayout");
  27. };

结论

  • 步骤一：window的resize事件触发doLayout方法，当前容器(上下文)是body；
  • 步骤二：doLayout方法搜索“下一级响应式组件”，触发“下一级响应式组件”的"resize"方法；
  • 步骤三：“下一级响应式组件”的"resize"方法调用doLayout方法，也就是回到“步骤一”只不过当前容器(上下文)换成“下一级响应式组件”，它再次执行的时候，找的就是“下下级响应式组件”。

如此循环调用，一层一层顺序作响应式处理，直到找不到为止。值得注意的是，响应式处理不一定是从body开始，比如tabs组件在切换标签页的时候。

 性能问题

doLayout对“下一级响应式布局组件”的搜索代码是有很大优化空间的，当页面DOM结构很复杂的时候，特别是有大数据量表格的时候，在IE下的doLayout的搜索效率惨不忍睹，可以使用“children方法+递归调用+对普通表格不搜索”的方案优化。

你可能感兴趣的:(easyui,Fit,Fluid)

  • CSS 自适应图片根据 div 大小进行均匀填充 前端小助手 csstensorflow前端
    目录前言使用object-fit属性示例代码HTMLCSS总结相关阅读1.前言在Web开发中，经常需要图片根据其容器的大小进行自适应填充，使得图片在任何设备和屏幕尺寸下都能保持良好的显示效果。本文将介绍如何使用CSS中的object-fit属性来实现这一需求。2.使用object-fit属性object-fit是一个CSS属性，专门用于控制替换元素（如、等）在其容器内的显示方式。常用的值有：fil
  • FIT5147 Data Exploration and Visualisation 后端
    MonashUniversityFIT5147DataExplorationandVisualisationSemester1,2025DataExplorationProjectPart1:DataExplorationProjectProposalPart2:DataExplorationProjectReportYouareaskedtoexploreandanalysedataabouta
  • ASP.NET MVC5+EF6+EasyUI 后台管理系统（51）-系统升级 weixin_34245749 测试javascript游戏ViewUI
    系统很久没有更新内容了，期待已久的更新在今天发布了，最近花了2个月的时间每天一点点，从原有系统MVC4+EF5+UNITY2.X+Quartz2.0+easyui1.3.4无缝接入MVC5+EF6+Unity4.x+Quartz2.3+easyui1.4.3.并以easyui1.4.3的gray皮肤为基础，升级10个扁平化皮肤皮肤查看地址更新的主要目的：新的MVC5特性和更好的性能记录一下升级过程
  • 机器学习算法（2）—— 线性回归算法 疯狂的石头。 算法机器学习线性回归
    ‘’‘构造数据集’‘’x=[[80,86],[82,80],[85,78],[90,90],[86,82],[82,90],[78,80],[92,94]]y=[84.2,80.6,80.1,90,83.2,87.6,79.4,93.4]‘’‘模型训练’‘’实例化一个估计器estimator=LinearRegression()使用fit方法进行训练estimator.fit(x,y)查看回归系数
  • 转换器与预估器，KNN算法，朴素贝叶斯算法，决策树，随机森林的特点，优缺点 qq_43625764 笔记KNN算法随机森林朴素贝叶斯算法机器学习算法决策树
    转换器与预估器，KNN算法，朴素贝叶斯算法，决策树，随机森林的特点，优缺点1转换器与预估器实例化转换器fit_transform转换实例化预估器fit将训练集的特征值和目标值传进来fit运行完后，已经把这个模型训练出来了2KNN算法根据你的邻居来推测你的类别，如何确定谁是你的邻居（用距离公式，最常用的是欧式距离）还有曼哈顿距离–求绝对值，明可夫斯基距离（欧式距离和曼哈顿距离的一个退p=1曼哈顿距离
  • 【最佳实践】FIT框架：插件化架构如何彻底解决大型项目依赖管理难题？ 华为数据存储开源 架构javapython
    在传统Java开发模式中，大型项目的依赖管理问题一直是开发团队的痛点。无论是依赖版本冲突、服务更新时的依赖调整，还是模块间的耦合性问题，都像一张错综复杂的蜘蛛网，让开发者疲于应对。然而，FIT框架的出现，彻底改变了这一局面。它以插件化架构为核心，通过自定义的类加载隔离机制，将复杂依赖问题简化为插件与接口之间的清晰关系，为传统开发模式中棘手的依赖排查问题提供了一种全新的解决方案。传统Java开发中的
  • CSS 设置宽高的单位概览 夫琅禾费米线 css前端javascript
    CSS设置宽高的单位概览在CSS中，设置宽度和高度的单位有多种，每种单位都有特定的用途和适用场景。下面是常见的单位整理及使用示例。单位类型代表性单位使用场景视口单位vw,vh响应式布局，全屏背景百分比单位%相对父元素的宽高调整绝对单位px,cm固定宽高（如图标、按钮）相对单位em,rem字体相关布局或响应式设计内容适配单位auto,fit-content内容自适应的场景（如动态长度文本框）CSS函
  • 汽车控制应用对芯片的特殊要求 wangYH.air 汽车单片机嵌入式硬件
    汽车控制应用对芯片的特殊要求汽车控制芯片（如MCU、SoC）是车辆电子系统的核心，需满足严苛的行业标准和复杂工况需求。以下是汽车控制芯片的关键特殊要求：1.高可靠性（Reliability）寿命要求：汽车芯片需保证15~20年使用寿命（远超消费电子3~5年），且失效率低于1FIT（1failureperbillionhours）。环境适应性：温度范围：-40°C~+150°C（引擎舱附近芯片需耐受
  • python的统计库_python--学习笔记13 统计库 weixin_39959335 python的统计库
    可以先绘制散点图查看数据分布情况，然后再使用检验包进行Statsmodels用于探索数据、估计模型、并运行统计检验的Python包。importstatsmodels.apiassmy=df['sepallengthh'][:50]x=df['sepalwidth'][:50]X=sm.add_constant(x)#在现有矩阵添加截距列results=sm.OLS(y,x).fit()#fit方
  • easyUI 猪大爷爱你 easyui前端javascript
    一.easyUI的简介easyui是一款基于jQuery的前端框架，可以使用其中的组件进行布局以及用来做后台的管理界面。EasyUI是一个前端开发的框架，其将常用的页面开发使用的组件进行了封装，前端开发人员只需将EasyUI的资源导入项目后使用即可，快速提升开发效率。使用：①导入EasyUI的资源②查阅API文档使用EasyUI的组件完成页面开发二.easyUI的不足之处现在据了解到有三种UI框架
  • CCS6.2 编译出现 error #10099-D: program will not fit into available memory. 使用哪种类型定义的变量会占用.ebss空间 爱代码的小黄人 C语言学习c语言c++
    ebss段主要是存放全局变量。cinit段存放全局变量和静态变量的初始化代码。可以通过查看map文件来确定其具体的长度。ebss段放的是数据，需要分配在RAM中。cinit段放的是代码，可以分配在Flash中。两者是两块独立的存储单元，ebss段无法占用cinit的存储空间。出现这样的报错：“…/28335_RAM_lnk.cmd”,line138:error#10099-D:programwil
  • 解决问题：cannot import name ‘layers‘ from ‘paddle.fluid.和No module named ‘paddle.fluid.dataloader‘ halonaQZ paddle深度学习人工智能
    问题描述1：问题解决1：将frompaddle.fluid.dygraphimportlayers改成frompaddle.nn.layerimportlayers即可；问题描述2：问题解决2：将frompaddle.fluid.dataloader.collateimportdefault_collate_fn改成frompaddle.io.dataloader.collateimportdef
  • paddlepaddle(飞浆）报错name ‘libpaddle‘ is not defined及paddle.fluid.core_noavx 管春 数据分析paddlepaddlepaddle人工智能
    最近有一个OCR中文识别的需求，用到paddleocr，但服务器死活装不上paddlepaddle（python3.10.4,win8环境)先装了2.6.0的paddele,报name‘libpaddle’isnotdefined，然后降版本（2.4的某个版本，忘了），paddle.fluid.core_noavximport失败，发现服务器没有avx，这个版本不支持noavx的，去paddlep
  • Huawei AP4950DN瘦转胖 linux的rookie 华为
    #HuaweiAP4950DN默认地址：169.154.1.1COS：user：adminpassward：[email protected]首先确认AP版本、确认为FIT（瘦）模式还是FAT（胖）模式disversionHuaweiVersatileRoutingPlatformSoftwareVRP®software,Version5.170(AP4050DNFITV200R007C20SPC5
  • HTML中 video标签样式铺满全屏 小华0000 css前端
    video标签默认不是铺满的，即使手动设置宽高100%也不会生效，所以当需要video铺满div时，需要加上一个css样式关键是这个“object-fit:fill”，这样就可以解决了！object-fit属性指定元素的内容应该如何去适应指定容器的高度与宽度。object-fit一般用于img和video标签，一般可以对这些元素进行保留原始比例的剪切、缩放或者直接进行拉伸等。fill:默认，不保证
  • Tensorflow2.x框架-神经网络八股扩展-acc曲线与loss曲线 诗雨时
    loss/loss可视化，可视化出准确率上升、损失函数下降的过程博主微信公众号（左）、Python+智能大数据+AI学习交流群（右）：欢迎关注和加群，大家一起学习交流，共同进步！目录摘要一、acc曲线与loss曲线二、完整代码摘要loss/loss可视化，可视化出准确率上升、损失函数下降的过程一、acc曲线与loss曲线history=model.fit(训练集数据,训练集标签,batch_siz
  • 卷积神经网络八股（一）------20行代码搞定鸢尾花分类 有幸添砖java opencv
    编写不易，未有VIP但想白嫖文章的朋友可以关注我的个人公众号“不秃头的码农”直接查看文章，后台回复java资料、单片机、安卓可免费领取资源。你的支持是我最大的动力！卷积神经网络八股（一）------20行代码搞定鸢尾花分类引言用TensorflowAPI：tf.keras实现神经网络搭建八股Sequential的用法compile的用法fit的用法（batch是每次喂入神经网络的样本数、epoch
  • 第三讲-神经网络八股 loveysuxin Tensorflowtensorflow
    一、搭建神经网络六部法tf.keras搭建神经网络六部法1、import相关模块 2、train,test   #训练集、测试集3、model=tf.keras.models.Sequential #逐层搭建网络结构4、model.compile  #配置训练方法，选择训练使用的优化器、损失函数和最终评价指标5、model.fit   #执行训练过程，告知训练集和测试集的输入值和标签、每个batc
  • jEasyUI 创建带复选框的树形菜单 lsx202406 开发语言
    jEasyUI创建带复选框的树形菜单引言jEasyUI是一款流行的前端框架，它为开发者提供了丰富的UI组件，使得构建复杂的前端界面变得简单快捷。在众多组件中，树形菜单（Tree）以其直观的层级结构和丰富的交互性，在信息管理和展示中扮演着重要角色。本文将详细介绍如何使用jEasyUI创建一个带有复选框的树形菜单，并探讨其实现细节。标题优化使用jEasyUI创建复选框树形菜单的实践指南步骤解析：从零开
  • R语言报错 变数的长度不一样，需要改成元素自变量对应的名称 仿生bug r语言bigdata
    在进行回归，决策树等出现报错，观察数据等情况都无发现错误使用本地数据鸢尾花（yuānwěihuā）做示例，说明问题data(iris)train_sub=sample(nrow(iris),7/10*nrow(iris))trainset=iris[train_sub,]testset=iris[-train_sub,]fit1=rpart(iris$Species~.,data=trainset
  • CST六面体和四面体网格异同及应用场景 EMC仿真秀儿 硬件工程
    通常电磁仿真方式中，计算域会被划分为很多细小单元，每个细小单元上进行麦克斯韦方程组求解，而后得出仿真计算结果。网格影响仿真精度及速度，因此学习网格划分是十分重要的。CST算法FIT（有限积分法）、TLM（传输线矩阵法）、FEM（有限元法）、MOM（矩量法）及CFD（计算流体动力学）等使用不同的网格。FIT和TLM：六面体网格。FEM：四面体网格和平面网格。MOM：表面网格。CFD：八叉树网格。六面
  • 探索流体模拟新境界：Unity中的基于位置的动力学（PBD）在GPU上的壮丽实践 仲玫千Samson
    探索流体模拟新境界：Unity中的基于位置的动力学（PBD）在GPU上的壮丽实践PBD-Fluid-in-UnityAPBDfluidinunityrunningontheGPU项目地址:https://gitcode.com/gh_mirrors/pb/PBD-Fluid-in-Unity项目介绍欢迎来到一个创新的粒子流体动力学仿真项目，它在Unity引擎中运用GPU的强大计算力，将基于位置的动
  • java web 项目中封装的下拉列表小组件：实现下拉列表使用者前后端0行代码 ... weixin_34383618 java前端后端ViewUI
    导读：主要从4个方面来阐述，1：背景；2：思路；3：代码实现；4：使用一：封装背景像easyui之类的纯前端组件，也有下拉列表组件，但是使用的时候，每个下拉列表，要配一个URL,以及设置URL反回来的值和select的text，和value的对应关系，这有2个问题：一使用者必须知道URL，二，如果页面有10个下拉表表，要请求后台10次，肯定影响性能，而我想要的是使用者只要申明用哪个数据字典就行了，
  • 使用MaxKB及deepseek搭建本地AI知识库 deepseek
    序本文主要研究一下如何MaxKB及deepseek搭建本地AI知识库步骤拉取MaxKB镜像dockerpullcr2.fit2cloud.com/1panel/maxkb如果拉取不下来就用docker.1ms.run/1panel/maxkb启动MaxKBdockerrun-d--name=maxkb--restart=always-p8080:8080\-v~/.maxkb:/var/lib/p
  • pdf在页面中预览的方法 weixin_45907435 pdf
    1、iframe使用方法相关属性（属性间用&连接拼接到src中）：1、缩放比例：#zoom=120；（表示将文件放大120%）2、跳往特定页数：#page=33、工具栏：#toolbar=0（0隐藏、1显示）菜单栏：#menubar=0（0隐藏、1显示）4、页面自适应屏幕：#view=Fit页面自适应水平宽度：#view=FitH页面自适应垂直高度：#view=FitV5、侧边导航栏状态：#nav
  • 让图片填满 ＜div＞ 容器且不变形 HWL5679 前端css
    图片填满容器且不变形，可以使用CSS的object-fit属性。object-fit属性指定如何调整替换元素（比如图片或视频）的内容以适应其容器的高度和宽度，同时保持其宽高比。.li-top{width:/*设置你想要的宽度*/;height:/*设置你想要的高度*/;overflow:hidden;/*隐藏溢出部分*/}.li-topimg{width:100%;height:100%;obje
  • 1Panel开源面板全平台下载总量突破1,000,000次！ FIT2CLOUD飞致云 开源1Panel面板运维
    截至2024年12月13日，FIT2CLOUD飞致云旗下开源项目——1Panel开源Linux服务器运维管理面板全平台下载总量突破1,000,000次！
  • Halcon基础（3）打开一张图像的几种方式 打鱼的渔夫wh #halcon
    读取图像:read_image打开图像窗口:dev_open_window获取图像尺寸:get_image_size显示图像:dev_display设置窗口句柄:dev_set_window合适的窗口:dev_open_window_fit_image(dev_open_window_fite_size)read_image(Image,'1')*打开图像窗口dev_open_window(0,0
  • Python-机器学习（二）-K近邻算法的原理与鸢尾花数据集实现详解 2401_84009679 程序员机器学习python近邻算法
    fromsklearn.neighborsimportKNeighborsClassifierk=5#对模型训练clf=KNeighborsClassifier(n_neighbors=k)clf.fit(x,y)#对样本进行预测x_sample=[[0,2]]neighbors=clf.kneighbors(x_sample)neighbors[1]plt.figure(figsize=(16,
  • pop_front front 释放内存_C++Deque潜在的内存问题 侯稳 pop_frontfront释放内存
    太长不读:TLDRC++标准库的deque在做完大量pop_front操作后,不一定会释放内存.有时候需要调用shrink_to_fit()强制它释放内存.https://stackoverflow.com/questions/1242357/how-to-release-memory-from-stddeque背景最近在用zlib对内存里的数据做一些压缩和解压的操作,结果遇到了莫名的内存泄露问题
  • 如何用ruby来写hadoop的mapreduce并生成jar包 wudixiaotie mapreduce
    ruby来写hadoop的mapreduce，我用的方法是rubydoop。怎么配置环境呢： 1.安装rvm：     不说了 网上有 2.安装ruby：     由于我以前是做ruby的，所以习惯性的先安装了ruby，起码调试起来比jruby快多了。 3.安装jruby：     rvm install jruby然后等待安
  • java编程思想 -- 访问控制权限 百合不是茶 java访问控制权限单例模式
    访问权限是java中一个比较中要的知识点,它规定者什么方法可以访问,什么不可以访问   一:包访问权限;   自定义包: package com.wj.control; //包 public class Demo { //定义一个无参的方法 public void DemoPackage(){ System.out.println("调用
  • [生物与医学]请审慎食用小龙虾 comsci 生物
         现在的餐馆里面出售的小龙虾,有一些是在野外捕捉的,这些小龙虾身体里面可能带有某些病毒和细菌,人食用以后可能会导致一些疾病,严重的甚至会死亡.....      所以,参加聚餐的时候,最好不要点小龙虾...就吃养殖的猪肉,牛肉,羊肉和鱼,等动物蛋白质     
  • org.apache.jasper.JasperException: Unable to compile class for JSP: 商人shang maven2.2jdk1.8
    环境： jdk1.8    maven  tomcat7-maven-plugin  2.0 原因： tomcat7-maven-plugin  2.0 不知吃 jdk 1.8，换成 tomcat7-maven-plugin  2.2就行，即     <plugin>
  • 你的垃圾你处理掉了吗?GC oloz GC
    前序:本人菜鸟，此文研究学习来自网络，各位牛牛多指教　 1.垃圾收集算法的核心思想 　　Java语言建立了垃圾收集机制，用以跟踪正在使用的对象和发现并回收不再使用(引用)的对象。该机制可以有效防范动态内存分配中可能发生的两个危险：因内存垃圾过多而引发的内存耗尽，以及不恰当的内存释放所造成的内存非法引用。 　　垃圾收集算法的核心思想是：对虚拟机可用内存空间，即堆空间中的对象进行识别
  • shiro 和 SESSSION 杨白白 shiro
    shiro 在web项目里默认使用的是web容器提供的session，也就是说shiro使用的session是web容器产生的，并不是自己产生的，在用于非web环境时可用其他来源代替。在web工程启动的时候它就和容器绑定在了一起，这是通过web.xml里面的shiroFilter实现的。通过session.getSession()方法会在浏览器cokkice产生JESSIONID，当关闭浏览器，此
  • 移动互联网终端 淘宝客如何实现盈利 小桔子 移動客戶端淘客淘寶App
           2012年淘宝联盟平台为站长和淘宝客带来的分成收入突破30亿元，同比增长100%。而来自移动端的分成达1亿元，其中美丽说、蘑菇街、果库、口袋购物等App运营商分成近5000万元。 可以看出，虽然目前阶段PC端对于淘客而言仍旧是盈利的大头，但移动端已经呈现出爆发之势。而且这个势头将随着智能终端(手机，平板)的加速普及而更加迅猛
  • wordpress小工具制作 aichenglong wordpress小工具
    wordpress 使用侧边栏的小工具，很方便调整页面结构 小工具的制作过程 1 在自己的主题文件中新建一个文件夹(如widget)，在文件夹中创建一个php(AWP_posts-category.php) 小工具是一个类,想侧边栏一样，还得使用代码注册，他才可以再后台使用，基本的代码一层不变 <?php class AWP_Post_Category extends WP_Wi
  • JS微信分享 AILIKES js
    // 所有功能必须包含在 WeixinApi.ready 中进行    WeixinApi.ready(function(Api) {        // 微信分享的数据            var wxData = {       &nb
  • 封装探讨 百合不是茶 JAVA面向对象 封装
    //封装   属性 方法 将某些东西包装在一起，通过创建对象或使用静态的方法来调用，称为封装；封装其实就是有选择性地公开或隐藏某些信息，它解决了数据的安全性问题，增加代码的可读性和可维护性   在 Aname类中申明三个属性，将其封装在一个类中：通过对象来调用   例如   1： //属性 将其设为私有 姓名 name 可以公开
  • jquery radio/checkbox change事件不能触发的问题 bijian1013 JavaScriptjquery
    我想让radio来控制当前我选择的是机动车还是特种车，如下所示：  <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"><
  • AngularJS中安全性措施 bijian1013 JavaScriptAngularJS安全性XSRFJSON漏洞
            在使用web应用中，安全性是应该首要考虑的一个问题。AngularJS提供了一些辅助机制，用来防护来自两个常见攻击方向的网络攻击。 一.JSON漏洞         当使用一个GET请求获取JSON数组信息的时候（尤其是当这一信息非常敏感，
  • [Maven学习笔记九]Maven发布web项目 bit1129 maven
    基于Maven的web项目的标准项目结构 user-project     user-core     user-service     user-web        src      
  • 【Hive七】Hive用户自定义聚合函数(UDAF) bit1129 hive
    用户自定义聚合函数，用户提供的多个入参通过聚合计算(求和、求最大值、求最小值)得到一个聚合计算结果的函数。 问题：UDF也可以提供输入多个参数然后输出一个结果的运算，比如加法运算add(3，5)，add这个UDF需要实现UDF的evaluate方法,那么UDF和UDAF的实质分别究竟是什么？   Double evaluate(Double a, Double b)  
  • 通过 nginx-lua 给 Nginx 增加 OAuth 支持 ronin47
    前言：我们使用Nginx的Lua中间件建立了OAuth2认证和授权层。如果你也有此打算，阅读下面的文档，实现自动化并获得收益。SeatGeek 在过去几年中取得了发展，我们已经积累了不少针对各种任务的不同管理接口。我们通常为新的展示需求创建新模块，比如我们自己的博客、图表等。我们还定期开发内部工具来处理诸如部署、可视化操作及事件处理等事务。在处理这些事务中，我们使用了几个不同的接口来认证： &n
  • 利用tomcat-redis-session-manager做session同步时自定义类对象属性保存不上的解决方法 bsr1983 session
    在利用tomcat-redis-session-manager做session同步时，遇到了在session保存一个自定义对象时，修改该对象中的某个属性，session未进行序列化，属性没有被存储到redis中。 在 tomcat-redis-session-manager的github上有如下说明： Session Change Tracking As noted in the &qu
  • 《代码大全》表驱动法-Table Driven Approach-1 bylijinnan java算法
    关于Table Driven Approach的一篇非常好的文章： http://www.codeproject.com/Articles/42732/Table-driven-Approach package com.ljn.base; import java.util.Random; public class TableDriven { public
  • Sybase封锁原理 chicony Sybase
           昨天在操作Sybase IQ12.7时意外操作造成了数据库表锁定，不能删除被锁定表数据也不能往其中写入数据。由于着急往该表抽入数据，因此立马着手解决该表的解锁问题。     无奈此前没有接触过Sybase IQ12.7这套数据库产品，加之当时已属于下班时间无法求助于支持人员支持，因此只有借助搜索引擎强大的
  • java异常处理机制 CrazyMizzz java
    java异常关键字有以下几个，分别为 try catch final throw throws 他们的定义分别为 try：    Opening exception-handling statement. catch：  Captures the exception. finally： Runs its code before terminating
  • hive 数据插入DML语法汇总 daizj hiveDML数据插入
    Hive的数据插入DML语法汇总1、Loading files into tables语法：1) LOAD DATA [LOCAL] INPATH 'filepath' [OVERWRITE] INTO TABLE tablename [PARTITION (partcol1=val1, partcol2=val2 ...)]解释：1)、上面命令执行环境为hive客户端环境下： hive>l
  • 工厂设计模式 dcj3sjt126com 设计模式
      使用设计模式是促进最佳实践和良好设计的好办法。设计模式可以提供针对常见的编程问题的灵活的解决方案。 工厂模式 工厂模式（Factory）允许你在代码执行时实例化对象。它之所以被称为工厂模式是因为它负责“生产”对象。工厂方法的参数是你要生成的对象对应的类名称。 Example #1 调用工厂方法（带参数） <?phpclass Example{ 
  • mysql字符串查找函数 dcj3sjt126com mysql
      FIND_IN_SET(str,strlist) 假如字符串str 在由N 子链组成的字符串列表strlist 中，则返回值的范围在1到 N 之间。一个字符串列表就是一个由一些被‘,’符号分开的自链组成的字符串。如果第一个参数是一个常数字符串，而第二个是type SET列，则   FIND_IN_SET() 函数被优化，使用比特计算。如果str不在strlist 或st
  • jvm内存管理 easterfly jvm
    一、JVM堆内存的划分 分为年轻代和年老代。年轻代又分为三部分：一个eden,两个survivor。 工作过程是这样的：e区空间满了后，执行minor gc，存活下来的对象放入s0, 对s0仍会进行minor gc，存活下来的的对象放入s1中，对s1同样执行minor gc，依旧存活的对象就放入年老代中； 年老代满了之后会执行major gc，这个是stop the word模式，执行
  • CentOS-6.3安装配置JDK-8 gengzg centos
    JAVA_HOME=/usr/java/jdk1.8.0_45 JRE_HOME=/usr/java/jdk1.8.0_45/jre PATH=$PATH:$JAVA_HOME/bin:$JRE_HOME/bin CLASSPATH=.:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib/tools.jar:$JRE_HOME/lib export JAVA_HOME
  • 【转】关于web路径的获取方法 huangyc1210 Web路径
    假定你的web application 名称为news,你在浏览器中输入请求路径：  http://localhost:8080/news/main/list.jsp  则执行下面向行代码后打印出如下结果：  1、 System.out.println(request.getContextPath()); //可返回站点的根路径。也就是项
  • php里获取第一个中文首字母并排序 远去的渡口 数据结构PHP
    很久没来更新博客了，还是觉得工作需要多总结的好。今天来更新一个自己认为比较有成就的问题吧。 最近在做储值结算，需求里结算首页需要按门店的首字母A-Z排序。我的数据结构原本是这样的： Array ( [0] => Array ( [sid] => 2885842 [recetcstoredpay] =&g
  • java内部类 hm4123660 java内部类匿名内部类成员内部类方法内部类
         　在Java中，可以将一个类定义在另一个类里面或者一个方法里面，这样的类称为内部类。内部类仍然是一个独立的类，在编译之后内部类会被编译成独立的.class文件，但是前面冠以外部类的类名和$符号。内部类可以间接解决多继承问题,可以使用内部类继承一个类，外部类继承一个类，实现多继承。      &nb
  • Caused by: java.lang.IncompatibleClassChangeError: class org.hibernate.cfg.Exten zhb8015
    maven pom.xml关于hibernate的配置和异常信息如下，查了好多资料，问题还是没有解决。只知道是包冲突，就是不知道是哪个包....遇到这个问题的分享下是怎么解决的。。   maven pom:   <dependency> <groupId>org.hibernate</groupId> <ar
  • Spark 性能相关参数配置详解－任务调度篇 Stark_Summer sparkcachecpu任务调度yarn
    随着Spark的逐渐成熟完善, 越来越多的可配置参数被添加到Spark中来, 本文试图通过阐述这其中部分参数的工作原理和配置思路, 和大家一起探讨一下如何根据实际场合对Spark进行配置优化。   由于篇幅较长，所以在这里分篇组织，如果要看最新完整的网页版内容，可以戳这里：http://spark-config.readthedocs.org/，主要是便
  • css3滤镜 wangkeheng htmlcss
    经常看到一些网站的底部有一些灰色的图标，鼠标移入的时候会变亮，开始以为是js操作src或者bg呢，搜索了一下，发现了一个更好的方法：通过css3的滤镜方法。 html代码： <a href='' class='icon'><img src='utv.jpg' /></a> css代码： .icon{-webkit-filter: graysc
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他