• 通过jquery在列表最后追加div标签实现

    var flexhook = $('.flex-hook');
    if(flexhook.length > 0 && flexhook.children().length > 0) {
        var flexchild = flexhook.children().get(0);
        var flexchildren = flexhook.children().length;
        var flexcolumn = flexhook.data('flex-column');
        var flexappend = (flexcolumn - (flexchildren % flexcolumn)) % flexcolumn;
        var flexchildwidth = $(flexchild).width();
        if(flexappend > 0) {
            var flexspace = (flexhook.width() - flexcolumn * flexchildwidth) / (flexcolumn - 1);
            flexspace = (flexappend > 1) ? (flexappend - 1) * flexspace : 0;
            $('<div></div>').width(flexchildwidth * flexappend + flexspace).appendTo(flexhook);
        }
    }
  • 在需要进行hook的标签上加上class flex-hook,并且在这个标签中加上 data属性 指明列数,如:data-flex-column="4"