EasyUI的简单使用

      ext 和easyui 都算是JS框架吧，不同的是easyui 是基于JQUERY 的。这两个东西做出来的页面都还算比较好看，至少比我折腾出来的页面好看，个人认为，如果是做项目，给某个企业做东西，还是选一个的比较好，或者都不选，另外选个与这两个类似的一个框架也行，总之用了有好处。

      以前的项目都是程序员，写代码，然后找美工来美化页面，这样的一个模式，很容易一遍又一遍，反复又反复，因为一个项目总有很多相关项目人员，美工、程序员、项目经理、单位领导、客户。十个先生九本书，每个人看东西的眼光都不一样，尤其遇到一些注重字体和颜色的领导，下面的人就有事情可做了。最后的结果往往还是一个是大家都不满意的结果，因为时间不允许折腾了。有js框架后，这个问题就基本上没有了。因为页面风格基本上定了，想大修改也不行，而且也是一个大部分人都能认可的，还算是比较好看的。

        当然框架缺点也不是没有，ext 这个东西大家都知道的，一是页面有点慢，二是开发速度慢，三是好看程度也就这样了，不能更好。所以注定了这个玩意的生存空间了。还有一个js 框架 easyui，对这个了解一点，别的js框架俺不了解，俺就不说了，正如某伟人说的，没有调查就没有发言权嘛。  easyui嘛，做出来的页面相对不是非常炫，应该是不够好，个人感觉哦，但是相对ext使用和开发就简单多了，所谓easy就是容易嘛。确实相对ext 来说要是easy多了。

       说了这么多，到具体项目，我们应该怎么选择，这个嘛，有个什么培训中有一句名言，你的任何选择，都是对的。其实那个培训是激励那些在生活中有时候，不敢做出各种选择的人。在这里借用一下，但是意思不一样的哦。首先一点，如果项目将来访问用户很多很多的话，个人觉得都不能选，最好是自己写原生的JS代码，而且还得是高手来写，因为访问用户多了，页面代码既需要效率，又需要好看，还要使用各种浏览器,甚至还需要满足别的条件之类的，所以js高手就有了用武之地了，当然像12306刚推出来的时候，是个人都能感觉到，那系统好像也是花了好多银子的......扯远了.......

      如果项目很大，人很多，还是用EXT更好，有了人多就不怕事多，不怕开发效率，不怕没时间，更不怕花钱了，要的就一个，最好一定得出来个漂亮的东西，你好，我好，大家好。也许这就是大项目的特色。但是小项目就不一定了，如果现实需要，花更少的钱做更多事情的。那就没办法，easyui或者与类似于easyui的框架 就是最好的选择。

    扯了这么多没用的，简单说说easyui具体怎么用吧。

      引用 easyui 框架文件，包括css和js 这个../js/ 路径自己改哦 

    <link rel="stylesheet" type="text/css" href="../js/themes/default/easyui.css"/>  
    <link rel="stylesheet" type="text/css" href="../js/themes/icon.css"/>  
    <script type="text/javascript" src="../js/EasyUI/jquery-1.8.0.min.js"></script>  
    <script type="text/javascript" src="../js/EasyUI/jquery.easyui.min.js"></script>  
    <script type="text/javascript" src="../js/EasyUI/easyui-lang-zh_CN.js"></script>

这个还是简单，我们整个简单点panel 吧

 <div id="p" class="easyui-panel" title="Basic Panel" style="width:500px;height:200px;padding:10px;">  
 第一个easyui-panel
 </div>  

与html 写法是一样的 div 的class 设置为 "easyui-panel" 而已。 
这个写法就是让我们熟悉html + js 的高手不用重新学习，而ext 就不一样了，所有的都是界面元素都js来动态生成，系统运行效率没什么，关键作为程序开发效率就 纠结了

当然，easyui-panel 还有一种写法，那就是动态渲染，简单写写

<div id="p" style="padding:10px;">   
    <p>panel content.</p>   
    <p>panel content.</p>   
</div>   
  
$('#p').panel({   
  width:500,   
  height:150,   
  title: 'My Panel',   
 tools: [{   
  iconCls:'icon-add',   
   handler:function(){alert('new')}   
 },{   
   iconCls:'icon-save',   
   handler:function(){alert('save')}   
  }]   
});   

这个搞法，个人感觉太麻烦了，EXT好像都是这么搞的，写的时候麻烦，维护的时候更麻烦.......还是第一种方式好啊，ext在以后的版本如果也能有这个，那就不得了，尤其没有版权不版权的时候。又说远了，我们是说easyui，不是说ext，哈哈

     当然，关于easyui中的panel，还有很多的属性和方法，这个不急，我们可以慢慢来。easyui 官网地址：http://www.jeasyui.com/ 有demo 也有API文档，还有教程。

这个东西，网上有说好，也说不好的，个人感觉总体还是不错的。有兴趣的自己尝试吧。