skel.js从数据库中的数据动态创建行

时间:2013-06-30 12:42:06

标签: javascript responsive-design

我正在使用skel.js构建一个响应式Web应用程序,除此之外,它必须在一个以每行3个为一组的小方框中显示来自mysql数据库的一堆数据。我面临的问题是如何安排来自mysql数据库的数据,以便每3条记录自动创建一个包含3个框的行,依此类推。

现在我正在使用jQuery来执行此操作:

$(window).load(function() {
      var divs = $("div#boxes");
      for(var i = 0; i < divs.length; i+=3) {
      divs.slice(i, i+3).wrapAll("<div class='row'></div>");
  }
});

然而,这样,当页面加载时,所有框都粘在一起。半秒后,给予或接受,最终布局按预期工作。我想从等式中删除那个丑陋的胶合盒效果。

我已经考虑过“延迟加载”记录,以3个为一组并“动态”构建html标记,但这会对性能产生相当大的影响,即imo。你觉得怎么样?

你能帮助我吗?

PS。每行的标记是:

<div class="row">
    <div class="12u">
        <section>
            <div class="4u" id="boxes">
                <section class="box">
                    <!-- mySQL data -->
                </section>
                <section class="box">
                    <!-- mySQL data -->
                </section>
                <section class="box">
                    <!-- mySQL data -->
                </section>
            </div>
        </section>
    </div>
</div>

0 个答案:

没有答案