项目实践――Easyui解析器

项目实践――Easyui解析器,第1张

概述介绍:解析器可是easyui一个重要基础插件,你之所以可以通过简单class定义,在浏览器里面就能展现出一个布局或是面板。全是通过这个插件作为入口,他会获取所有在指定范围内所有定义为easyui组件的class定义,然后在根据后缀定义辨别需要把当前节点解析成为何种组件。 解析器有两种用法: 介绍:  

  解析器可是easyui1个重要基础插件,你之所以可以通过简单class定义,在阅读器里面就可以展现出1个布局或是面板。全是通过这个插件作为入口,他会获得所有在指定范围内所有定义为easyui组件的class定义,然后在根据后缀定义辨别需要把当前节点解析成为什么种组件。

    解析器有两种用法:
    $.parser.parse();不带任何参数。这类情况下默许是解析页面中所有定义为easyui组件的节点。
   $.parser.parse('#cc');  带1个jquery选择器。通过这类方式我们可以只解析我们局部定义的easyui组件,

需要说明的这个jquery选择器必须是你解析组件的父级以上的节点。也就是说这个查找出来的节点相当于1个容器,它只会解析容器里面的内容。

使用:

  说这么多,不过是为了使用,对Easyui表格中,想要在表格后面拼接1个Easyui样式的按钮控件,之前要不是拼超链接文字,要不是拼接1个图片,历来没有拼接成功过EasyUi样式的按钮,偶然的机会,看到了EasyUI的解析器,终究解决了Easyui表格中拼EasyUI样式控件的问题。


HTML:





<body> <div ID="tb" style="padding: 5px;height: auto;">  <a href="JavaScript:add();" class="easyui-linkbutton" plain="true" data-options="iconCls:'icon-add'">add</a> <a href="JavaScript:edit();" class="easyui-linkbutton" plain="true" data-options="iconCls:'icon-edit'">edit</a> <a href="JavaScript:del();" class="easyui-linkbutton" plain="true" data-options="iconCls:'icon-remove'">del</a> <a href="JavaScript:detial();" class="easyui-linkbutton" plain="true" data-options="iconCls:'icon-zoom_out'">vIEw</a> </div> <div ID="grID" ></div></body>

JavaScript:



<script type="text/JavaScript">onload = function(){ $('#grID').datagrID({ url:getRootPath()+"/tempalte/getTemmiscByDepID.do;" + $.Now(),rownumbers:true,pageSize:10,fitColumns:true,pagination:true,striped:true,singleSelect:true,fit:true,columns:[[ {fIEld:'ID',Title:"ID",wIDth:100,hIDden:true,align:'center'},{fIEld:'templatename',Title:"templatename",wIDth:200,{fIEld:'jobtypeID',Title:"jobtypeID",align:'center',hIDden:true},{fIEld:'deptID',Title:"depID",{fIEld:'templatetype',Title:"templatetype",{fIEld:'orderindex',Title:"MoveUp/MoveDown",wIDth:90,formatter: function(value,row,index){ if(row.ID!=""){ var $div = $("<div/>").append("<a href=# class='easyui-linkbutton' iconCls='icon-arrow_up' plain=true onclick='up("+index+")'>GoUp</a>    <a href=# class='easyui-linkbutton' iconCls='icon-arrow_down' plain=true onclick='down("+index+")'>Down</a>"); $.parser.parse($div); return $div.HTML(); } },},]],toolbar: "#tb" });};


  其中,通过$.parser.parse($div);将拼接好的div用easyui的解析器解析1下,这样在formmat的时候就会出现EasyUI的样式。如果单纯的拼接Easyui的的标签,在formmat函数内不会出来Easyui的效果,但是通过$.parser.parse($div)将拼接的带有EasyUI样式的字符串直接解析出来,从而解析出来Easyui的样式,这样就在formmat函数内显示出EasyUI的控件样式来。


效果:







小结:

  Easyui的1切都是基于解析器$.parser.parse()完成的。



总结

以上是内存溢出为你收集整理的项目实践――Easyui解析器全部内容,希望文章能够帮你解决项目实践――Easyui解析器所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1016810.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-22
下一篇 2022-05-23

发表评论

登录后才能评论

评论列表(0条)

保存