加载中…
个人资料
  • 博客等级:
  • 博客积分:
  • 博客访问:
  • 关注人气:
  • 获赠金笔:0支
  • 赠出金笔:0支
  • 荣誉徽章:
正文 字体大小:

jQueryEasyUI入门基础组件的三要素

(2022-08-17 14:36:57)
标签:

h5前端培训

java培训

ui设计培训

菁瑞优智

it

EasyUI是一组基于jQuery的UI插件集合,封装了大量CSS和JS,前端开发者只需要了解一些简单的HTML标签,就可以使用EasyUI做出功能丰富并且美观的UI界面。

EasyUI组件都具有属性、方法、事件,即组件的三要素。

1、属性:属性描述了组件的更多信息。学IT到菁瑞优智

我们通过配置这些属性,可以让EasyUI提供不同的显示效果或功能,比如面板组件有title属性,iconCls属性,collapsed属性。

所有的属性都定义在jQuery.fn.{plugin}.defaults里面。例如,panel面板的属性定义在jQuery.fn.panel.defaults里面。

如果创建组件的时候,我们没有设置组件的属性,那么就使用默认属性。

例如,panel面板的默认属性console.debug($.fn.panel.defaults);

如果要修改组件的默认属性,则使用$.fn.panel.defaults.closable = true。

特别提醒,属性只能在创建(初始化)组件有效,组件创建完毕后,如果对某个属性进行了修改无效。

2、方法:方法其实就是组件中的某个功能。学IT到菁瑞优智

我们可以调用组件中的方法,从而达到我们要求。

如果写了EasyUI组件之后传入的第一个参数是字符串,那么就代表执行组件上面某一个方法。

样式$('selector').plugin('method', [parameter]),其中:

selector 是jQuery对象选择器。

plugin 是插件的名称。

method 是相应插件现有的方法。

parameter 是参数对象,可以是一个对象、字符串等。

比如:现在我想隐藏页面中的某个面板,即$(“#mypanel”).panel(“close”)。

如果写了EasyUI组件之后传入的第一个参数不是一个字符串,那么就是创建组件,传入的参数是json字符串;如果没有传入参数还是创建组件。

样式$('selector').plugin()(没有传递参数),$('selector').plugin({})(传递json参数)。

特别提醒,如果尝试调用一个非组件的组件方法会直接报错。

3、事件:如果组件发生了什么事情,那么它就会通过事件反应给我们。学IT到菁瑞优智

比如:我们点击tree组件的某个节点,那么就会触发onClick事件。

所有的事件(回调函数)也都定义在jQuery.fn.{plugin}.defaults里面。

特别提醒,注册事件不能采用dom传统方式注册,需要通过组件注册。

0

阅读 收藏 喜欢 打印举报/Report
  

新浪BLOG意见反馈留言板 欢迎批评指正

新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 产品答疑

新浪公司 版权所有