zoukankan      html  css  js  c++  java
  • EaeyUI

    基础  定义  一个轻量级的JavaScript框架

        基本用法  $(function(){代码})  相当于window.load()(当窗口加载完毕后触发)

              选择器是jQuery的根基  通过选择器选中元素之后再操作

                           调用方法要使用 function(){方法的代码}

    选择器  基本选择器  id选择器  $(“#id”)

                      根据id匹配一个元素,返回单个元素组成的集合

                标签选择器  $(“标签”)

                      根据标签名匹配元素,返回匹配该标签的元素的集合

                类选择器  $(“.类名”)

                      根据class匹配元素,返回匹配该class的元素的集合

         层次选择器  根据元素之间的层次关系获取相关的元素

                子元素

                相邻元素

                兄弟元素

                后代元素

         过滤选择器  基本过滤器  :first  首个元素

                       :last  最后一个元素

                       :even  索引是偶数的元素

                       :odd  索引是奇数的元素

                内容过滤器  通过子元素和文本内容过滤

                可见性过滤器  根据元素的可见和不可见状态过滤

                属性过滤器  通过元素的属性过滤

                子元素过滤器

                表单过滤器

                表单对象属性过滤器

    对象转换  Dom对象转成jQuery对象  $(Dom对象)

          jQuery对象转成Dom对象  jQuery对象是数组对象  jQuery对象[索引]

                                    jQuery对象.get[索引]

    配置  jQuery的js包  <script type="text/javascript" src="jquery-easyui-1.4.4/jquery.min.js"></script>

        主css文件  <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.4/themes/default/easyui.css">   

        图标css文件  <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.4/themes/icon.css">

        easyui的js包  <script type="text/javascript" src="jquery-easyui-1.4.4/jquery.easyui.min.js"></script> 

        本地语言的js包  <script type="text/javascript" src="jquery-easyui-1.4.4/locale/easyui-lang-zh_CN.js"></script>

    消息框  弹出  $.messager.alert(“aaa”,“bbb”,“error”,function(){代码} )  警告消息框显示警告窗口  

               参数:title:在头部面板显示的标题文本。

                  msg:显示的消息文本。

                  icon:显示的图标图像。可用值有:error(错误),question(问题),info(信息),warning(警告)。

                  fn: 在窗口关闭的时候触发该回调函数。  function(){代码}

         确认  $.messager.confirm  确定返回true,取消返回false

             参数:标题

                内容

                回调函数function(r){if(r){确定之后执行的代码}}

         输入框  $.messager.prompt  确定返回输入的内容,取消无任何返回

              参数:标题

                 内容

                 回调函数function(val){if(val){输入不为空执行的代码}}

         消息框  $.messager.show

              参数:showType:定义将如何显示该消息。可用值有:null,slide,fade,show。默认:slide。

              showSpeed:定义窗口显示的过度时间。默认:600毫秒。  

              width:定义消息窗口的宽度。默认:250px。

              height:定义消息窗口的高度。默认:100px。

              title:在头部面板显示的标题文本。

              msg:显示的消息文本。

              style:定义消息窗体的自定义样式。

              timeout:消息窗体将在超时后自动关闭。定义为0,不自动关闭。默认:4000毫秒。      

         进度条  $.messager.progress

              options参数:title:在头部面板显示的标题文本。默认:空。

                     msg:显示的消息文本。默认:空。 

                     text:在进度条上显示的文本。默认:undefined。

                     interval:每次进度更新的间隔时间。默认:300毫秒。

              method参数:bar:获取工具条

                     close:关闭工具条

    窗口框 window  必须有<div id="xx"></div>

       创建  标签方式  class=“easyui-window”

                 title=“标题”

                 style=“样式名:样式值;……”

                 data-options=“属性名:属性值,……”

           js方式  $(“#id”).window({属性名:属性值,……})

       调用  $(“#id”).window(“方法名”)

           $(“#id”).window(“方法名”,参数)

    对话框窗口 dialog

       依赖于  window  

            linkbutton  <a id="ID" href=“#”></a>

                   text=“按钮文字”

                   iconCls=“图标”  

       属性  toolber  [{text:“按钮文本”,iconCls:“图标”,handler:function(){点击发生的动作}}]

           buttons  同toolber

    布局  panel  承载其他内容的容器,构建其他组件的基础

              title=“标题”

              iconCls=“图标”

              fit=“true”  true是自适应容器,默认是false

              closed=“true”  初始化时是否关闭

              href=“url”  从url读取远程数据并显示

              方法  open  打开

                  close  关闭

                  refresh  刷新

        layout  布局方式  局部  <div

                   整体

                   嵌套

             属性(区域面板)  region  定义布局面板位置,可用的值有:north, south, east, west, center

                       split  为true时用户可以通过分割栏改变面板大小

                       href  用于读取远程站点数据的URL链接

        accordion  定义方式  <div class=“easyui-accordion”><div></div></div>

               容器属性  fit=“true/false”  是否自适应

                     selected=初始时默认展开的索引

               面板属性  selected=“true”  当前面板是否展开,会覆盖容器的展开属性

               方法  add  添加面板

                   remove  移除面板

        tabs  定义方式  <div class=“easyui-accordion”><div></div></div>

            容器属性  fit=“true/false”  是否自适应

                  selected=初始时默认展开的索引

            面板属性  selected=“true”  当前面板是否展开,会覆盖容器的展开属性

                  closable=“true”  是否显示关闭按钮

            方法  add  添加面板

                remove  移除面板

                exists  判断是否存在标签

    表单  validatebox  基础的验证组件

                属性  required=“true/false”  是否必填

                    validType  字段验证类型,可同时设置多个类型

        textbos  文本框

              属性  prompt=“框内提示”

                  type=“text/password”  显示的类型,只有文本和密码两种

                  editable=“true/false”  是否可以直接编辑

                  readonly=“true/false”  是否只读

                  buttonText=“按钮文本”

        numberbox  属性  min=“最小值”

                    max=“最大值”

                    precision=“小数点后精度”  默认是精确到个位,自动四舍五入

        datebox  属性  readonly=“true”  不能更改日历

                  editable=“false”  不能手动编辑日期,只能点击日历更改

        datetimebox  日期和时间框

                属性  showSeconds=“true/false”  是否显示秒数

        combobox  下拉列表框

               属性  url=“远程加载数据的地址”

                   valueField=“基础数据值名称”

                   textField=“基础数据显示名称”

                   editable=“true/false”  默认允许编辑

               方法  clear  清除显示内容

                   reload  重新加载列表项,可以用新的url重写原始的

               事件  onSelect  选中时触发

        form  方法  submit  url  提交的地址

                      onSelect  提交前触发的回调函数,如果返回false阻止表单提交

                      siccess  成功提交后的回调函数,接收响应数据。是典型的json相应数据格式

                            {‘success’:true,‘message’:‘相应内容’}  使用eval(“(”+json+“)”) 解析json数据

                validate  返回表单内的验证组件验证是否通过

    表格  datagrid  准备  <table id=""></table>  

                  属性  datagrid  columns  列的定义的数组

                            url  访问远程数据的地址{“total”:总记录条数,row:[{行对象}]}

                            toolbar  工具栏

                            pagination=“true/false”  是否显示分页栏

                      列  field  列对应的属性名

                         title  表头标题

                         checkbox=“true/false”  是否是复选框列,必须同时设置field

  • 相关阅读:
    HDU 2089 不要62
    HDU 5038 Grade(分级)
    FZU 2105 Digits Count(位数计算)
    FZU 2218 Simple String Problem(简单字符串问题)
    FZU 2221 RunningMan(跑男)
    FZU 2216 The Longest Straight(最长直道)
    FZU 2212 Super Mobile Charger(超级充电宝)
    FZU 2219 StarCraft(星际争霸)
    FZU 2213 Common Tangents(公切线)
    FZU 2215 Simple Polynomial Problem(简单多项式问题)
  • 原文地址:https://www.cnblogs.com/jingfengling/p/6089964.html
Copyright © 2011-2022 走看看