Question

我的JS脚本允许我按以下顺序输出顺序用户输入（计数器迭代和\ t间距）：

1. ab     2. bc    3. cd
4. de     5. ef    6. fg
7. gh     8. hi    9. ij
10. jk    11. ys

用户只有1个输入字段，一次输入1个条目。 11不是最后一个条目，因为他们可以继续工作输入更多。 如何显示？

1. ab     5. ef    9. ij
2. bc     6. fg    10. jk
3. cd     7. gh    11. ys
4. de     8. hi

我的剧本：

dnm_data.list_count += 1;
var data_output =  "<b>" + dnm_data.list_count + ".</b> " + data;

if (dnm_data.list_count % 3 === 0)
    data_output  = "<div class='col-xs-4'>" + data_output + "</div><div class='clearfix'></div>";
else 
    data_output = "<div class='col-xs-4'>" + data_output + "</div>";

$("#log-wrapper")  .append( data_output )
                   .addClass("bg-success")

Answer 1

您可以将每个输入值放在一个数组中，并在每次输入后将其拆分为3个相等的数据块（或其他内容）并重建整个数据。

但是，您可能需要查看css3列。你只需像现在一样附加到包装器上，css将负责其余部分。

https://jsfiddle.net/5q3tqcrm/

使用div和ul / li进行了尝试。唯一的缺陷是当有4个值时它会变为2列，因为在移动后它总是在第3列中清除2个位置。

信息＆amp;资源：http://caniuse.com/#search=multiple%20column

以不同的顺序输出数据

1 个答案: