easyui使用介绍

http://www.jeasyui.com/index.php

 

based on jQuery, Angular and Vue.

 

don't need to write many javascript code, you usually define user-interface by writing some HTML markups.

 

Freeware edition does not include source code (code is "compressed").

 

Each component of easyui has properties, methods and events. Users can extend them easily.

 

properties is defined in jQuery.fn.{plugin}.defaults

events(callback functions) is defined in jQuery.fn.{plugin}.defaults also. 一样

Methods defined in jQuery.fn.{plugin}.methods.

 Each method has two parameters: jq and param. 

调用:$('selector').plugin('method', parameter);

 

引入

  1. <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css">
  2. <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css">
  3. <script type="text/javascript" src="easyui/jquery.min.js"></script>
  4. <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>

 

或可选的

//引入语言包 <script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js" ></script>

 

 

https://www.kancloud.cn/aktiajyx/jquery-easyui/250048

 

窗口

Load window content via ajax.

  1. $('#win').window('refresh', 'get_content.php');

 

 

动态添加tabs

http://www.jeasyui.com/tutorial/layout/tabs2.php

http://www.jeasyui.net/tutorial/17.html

 

 

分页

 

折叠面板:个人感觉可以用作左侧导航, 布局也可以作左侧导航(region="west"和center)

 

布局:5部分,可以嵌套, 如果放在整个页面上,需要加在body上<body class="easyui-layout">,而不是<div id="cc" class="easyui-layout"

fit属性:尺寸适应它的父容器

 

有时<!DOCTYPE html> 这行代码会出现

 

菜单

 

sidemenu

 

按钮有链接按钮,

菜单按钮:可实现下拉式菜单,

SplitButton跟菜单按钮差不多,区别是, splitbutton is split into two parts.When moving mouse over the splitbutton, a 'split' line will display. The menu only display when moving mouse over the right part of splitbutton.

 

SwitchButton

 

 

MaskedBox:结构化输入

 

 

 

Combo:display a editable text box and drop-down panel

 

DataGrid

 

DataList:a special datagrid that displays data in one column.

 

ComboBox:display an editable text box and drop-down list,user can select one or multiple values. 

 

ComboTree: similar to combobox but replace the list with tree component.

ComboGrid:an editable text box with drop-down datagrid panel

 

 

 

TreeGrid

ComboTreeGrid

 

 

TagBox

 

Spinner:

 

 

Messager

PropertyGrid

 

Tree

 

 

RTL (Right to Left) 

 

示例程序源码

http://www.jeasyui.com/demo/main/index.php

http://www.jeasyui.com/tutorial/index.php

 

中文文档http://www.jeasyui.net/plugins/

 

其它:rtl解释:https://www.theme-junkie.com/what-is-rtl-wordpress-theme/

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值