图标自动分布的实现:从MVC到jQuery插件

【场景】由于项目需要,需要将区县的局单位名称显示在触摸屏上(每个局附上相应链接),且每个局单位都有自己的标识符。现在想写一个前端页面来展示,要求 到时去不同区县部署时只用修改一二个参数(比如到时部署时设置显示的画布尺寸、一行几个图标就可以)就能方便的更改布局。

>>>效果<<<

   >>>操作<<<

        之所以做这个,是因为项涉及17个区县,每个区县的各个局设立是不一样的,比如这个区县有30个局单位,另外一个区县有12个局单位。

        在做这个功能的同时,顺便练习了一下js的一些技能,所以就做了两版:

一版是基于Handlebars与LESS,目的是为了MVC分离,详见《Handlebars与LESS:图标自动分布的实现

另一个则是将其重构成jQuery插件,详见:《jQuery插件:图标自动分布的实现》。其中详细讲解了初学者如何创建自己jQuery插件的风格的过程,包括一些最佳实现以及注意事项。

原文地址:https://www.cnblogs.com/boychenney/p/iconLayout.html