$.ajax获取数据后如何按这个规则排列?

Question

流程通过$.ajax获取，需要按照图中样式进行排列，奇数列从左至右，偶数列从右往左。有哪些方法可以做到？支持css3、jquery、js

Answer 1

这个问题理解为布局问题，与 Ajax 无关。

渲染布局主要包括两个函数 renderRow 与 renderItem 分别表示渲染行，渲染行中的一个流程块，下面分析它们各自的职责要点：

renderRow：

1. 循环渲染行容器，根据奇偶输出左箭头/右箭头

renderItem：

1. 循环渲染单个流程块

2. 判断是否是当前流程，若是，渲染相应样式

3. 奇行 && 该行最后一个 && !最后一步流程，则在其下方渲染下箭头

4. 偶行 && 该行第一个 && !最后一步流程，则在其下方渲染下箭头

5. 若是该行最后一个，则右边不渲染 左/右箭头

基本上需要注意的就这些，仔细思考下不难实现