easyui之layout布局之后无法显示

最新推荐文章于 2022-02-16 14:11:02 发布
最新推荐文章于 2022-02-16 14:11:02 发布
阅读量3.2k 收藏
点赞数
文章标签： easyui 布局 

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Ÿ收银</title>
	<link rel="stylesheet" type="text/css" href="../../js/easyui1.5.1/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="../../js/easyui1.5.1/themes/icon.css">
	<link rel="stylesheet" type="text/css" href="../../js/easyui1.5.1/demo/demo.css">
	
	<script type="text/javascript" src="../../js/easyui1.5.1/jquery.min.js"></script>
	<script type="text/javascript" src="../../js/easyui1.5.1/jquery.easyui.min.js"></script>
	
	
  </head>
 <body> <!-- 利用面板进行布局 ，面板自适应body,layout要自适应面板 layout里的某个方位里有其他组件，那么组件要自适应方位 -->
       <div id="p" class="easyui-panel"  style="width:500px;height:150px;background:#fafafa;"
    data-options="fit:true">
           <div id="lay" class="easyui-layout" data-options="fit:true">
              <div data-options="region:'north',title:'收银系统'" style="height:1px"></div>
		      <div data-options="region:'south',split:true" style="height:50px;"></div>
		      <div data-options="region:'west',split:true" title="West" style="width:150px;">
		          <div id="acd" class="easyui-accordion" data-options="fit:true,border:false">
				       <div title="Title1" style="padding:10px;">
				       </div>
				       <div title="Title2" data-options="selected:true" style="padding:10px;">
					       content2
				       </div>
				       <div title="Title3" style="padding:10px">
					       content3
				       </div>
			     </div>
		      </div>
		      <div id="center" data-options="region:'center',iconCls:'icon-ok'" style="width:50px;">
			     <div id="tab" class="easyui-tabs" data-options="fit:true,border:false,plain:true">
				     <div title="DataGrid"  style="padding:10px"></div>
				     
				     <div title="DataGrid" style="padding:5px"></div>
			    </div>
		     </div>
		     <div data-options="region:'east',split:true" title="East" style="width:180px;"></div> 
          </div>
       </div>
  </body>
</html>


  

     当把class=“easyui-layout”写在一个独立的div中时，layout的样式无法显示，也不报错。

  其实这跟所放位置无关，只要注意一个属性fit:true的正确运用。当一个容器有子容器的时候，那么这个子容器就要自动适应父容器的大小，所以在子容器中加fit:true。

   注意：东西方位一定要指明宽度，南北方位一定要指明高度。

xin-hua
关注
easyui-layout中的收缩层无法显示标题问题解决
泓
08-30 2296
easyui layout 收缩 title 标题 无法显示 解决
easyui-layout布局高度自适应
故梦-阿梓
04-02 9580
动态加载datagrid数据$("#dg_center").datagrid({                url: ''/AJAX/EasyUiListComm.ashx',                fit: true, //datagrid高度是否自适应                nowrap: true, //是否只显示一行，即文本过多是否省略部分               ...
easyui layout布局内容显示不全
qq_24687915的博客
03-21 661
设置fit属性为false即可
easyui 1.5.2bug，Pagination（分页）layout属性设置 不显示分页
xqtkd的专栏
11-01 3434
发现easyui 1.5.2bug，Pagination（分页）控件layout属性设置时会出现分页不显示错误。 在jquery.easyui.min.js文件中搜索function _b3(_b5)，在其前面增加代码 $("").appendTo(_af); 解决！
关于easyui的tab页不打开过就不能显示内容的问题
weixin_34185560的博客
01-30 306
2019独角兽企业重金招聘Python工程师标准>>> ...
EasyUI Layout 显示隐藏中间区域示例
apollokk的专栏
09-29 3416
使用EasyUI的layout布局时中间区域是没有折叠功能的，有时候想要下方区域最大化只能手工拖动分隔条，不太方便，可以使用resize来调整区域的高度，达到目的。 示例效果： 代码： 显示或隐藏EasyUI Layout Center区域 body { line-height: 30px;
有关easyui-layout中的收缩层无法显示标题的解决办法
09-02
总结一下，解决EasyUI布局中收缩层无法显示标题的方法是： 1. 更新`jquery.easyui.min.js`到指定版本（如1.4.1）。 2. 在`_39d`方法内，保存面板折叠前的标题和图标信息。 3. 在设置面板属性的地方，将标题和图标...
EasyUI布局 高度自适应
11-22
最近在把以前写的一个项目改成用easyui做前端。过程中遇到了不少问题。其中一个就是datagrid不能很好的布局。...这个时候就应该用 easyui-layout来分隔窗体来使具体的内容放在easyui-layout不同的部分。这样就能很好
JQueryEasyUI Layout布局框架的使用
10-27
JQueryEasyUI Layout布局框架是基于JQuery的前端框架，它的主要功能是实现页面布局，能够快速构建具有高交互性的网页界面。在JQueryEasyUI的Layout布局中，页面被划分为多个区域，这些区域可以独立地展示内容，用户...
JQuery EasyUI Layout 在from布局自适应窗口大小的实现方法
10-22
本文主要探讨如何使用 jQuery EasyUI Layout 实现从布局在窗口大小调整时自适应的方法。 在 jQuery EasyUI 中，Layout 是一个强大的组件，用于创建复杂的页面布局。然而，当 Layout 应用于 form 元素时，可能会遇到...
jqeury-easyui-layout问题解决方法
12-09
今天在用easyui做布局时，碰到了一个疑惑的问题。 问题：当把class=“easyui-layout”写在一个独立的div中时，layout的样式无法显示，也不报错。 例如： 代码如下: <span xss=removed><body > <div class=”easyui-layout”> <div data-options=”region:’north’,title:’North xss=removed> </div> <div data-options=”region:’south’,title:
easyui layout使用问题
zhanglupingsinosoft的博客
07-19 272
easyui layout使用问题 在做一个easyui layout的demo的时候，遇到一个问题，就是不断该表窗口大小的时候有时候会报错：无效的参数 定位了一下，发现是jquery-1.8.0.js中有这么一行报错：           f[b] = d; f[b]接收的应该是 数字  +  px，但是d是NaN   +  px，这样就报错了     这个d是从最开始的jq...
Android Studio中layout属性显示不全的解决办法
.G();的博客
05-24 4157
Android Studio中layout属性显示不全的解决办法问题解决办法注意 问题 有一次，重新打开上一次未编完的代码，在编辑layout的xml文档时发现，layout属性显示不全，好像只显示已经定义的属性。但是在xml代码中自己手敲代码增加layout属性，studio不会报错！ 大家可以看到，属性只显示了已定义的属性，就几个 解决办法 经过资料发现，这个可能是版本问题。 点开左上角File标签栏，点击Project Structure 打开Modules项，这里是编写项目的SDK版本（我的是2
前端调试--外层div导致的部分页面无法显示
No_red的博客
03-19 962
概述 最近因为做毕业设计的原因不擅长前端开发的我也在硬着头皮写着html，css，js。之后会发一些与前端相关的文章。因为毕设是两个人一起完成，就设计到合作开发的问题，本次问题是我们在对前端代码进行重构后发生的，导致前端页面一直无法显示。 重现 正常前端界面： 重构后界面： 出现问题后仔细思考重构后都做了什么，但是只能通过比对两个文件的方式去看，速度很慢，并且误以为是百度ap...
easyui 动态html,easyUi无法动态加载
weixin_33331021的博客
06-08 173
1.有段页面写在js中当change事件得时候动态加载，页面直接拼接好，html()进去，拼接页面得easyUi样式不加载。2.代码中 $.parser.parse($('#condition-range').parent());是网上查询的重新加载方法，但试了多个ID均没有效果。代码如下：//更换类型function changeType() {var conditionRangeHtml = ...
antd for vue 使用layout样式不显示问题
Jaunty_Liu的博客
02-16 1989
antd for vue 使用layout样式不显示问题 使用Layout的话就要全局引入，不然会有很多小组件很麻烦，也就是： main.ts中添加： import Antd from 'ant-design-vue'; import 'ant-design-vue/dist/antd.css'; // or 'ant-design-vue/dist/antd.less' //原本是：createApp(App).use(store).use(router).mount('#app') // 改为： con
easyui datagrid toolbar 工具栏显示不正常问题之一
qq_37025885的博客
05-09 2784
datagrid定义：  toolbar:'#tlbar4'  通过id 关联工具栏&lt;table id="dg4" class="easyui-datagrid" title="result"   data-options="rownumbers:true,singleSelect:true,method:'post',toolbar:'#tlbar4',fitColumns:false" ...
easyui layout
最新发布
09-29
EasyUI是一个基于jQuery的UI库，提供了一些方便易用的UI组件和交互效果。EasyUI中的Layout组件可以帮助我们创建灵活的页面布局。 Layout组件将页面分割成一个或多个区域，每个区域都可以容纳其他组件或内容。它提供了不同的布局选项，如North、South、West、East和Center，用于指定每个区域的位置和大小。 例如，下面是一个简单的使用EasyUI Layout的示例： ```html <div class="easyui-layout" style="width:500px;height:300px;"> <div data-options="region:'north',split:true" style="height:100px;">North Region</div> <div data-options="region:'west',split:true" style="width:100px;">West Region</div> <div data-options="region:'center'">Center Region</div> </div> ``` 在这个示例中，使用`easyui-layout`类创建了一个具有宽度为500px和高度为300px的Layout容器。其中，`data-options`属性用于指定每个区域的位置和大小。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值