检查列表项的数量并在条件存在时将其列化

发布于 2024-09-15 19:40:03 字数 370 浏览 1 评论 0原文

示例页面： http://vincent-massaro.com/columns/columns.html

在此页面上，有两个有序列表，一个包含四个项目，另一个包含八个项目。我需要编写一个条件来检查每个有序列表中有多少列表项，如果超过四个，则将它们分成几列；如果少于四个，则不要分成列。现在完成此操作的代码是：

$('.mcol', this).makeacolumnlists({cols: 3, colWidth: 0, equalHeight: 'ul', startN: 1});

提前致谢！

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

这样的小城市 2024-09-22 19:40:03

一种不错的方法是使用自定义选择器。像这样的东西：

$.expr[':'].hasmorethan4li = function(obj){
  return $(obj).children('li').length > 4;
};

让你这样做：

$('ol:hasmorethan4li').makeacolumnlists(....);

Updated: As per the OP's question from the comments, here's a version of the selector for lists with between 4 and 12 items:

$.expr[':'].hasbetween4and12li = function(obj){
  var len = $(obj).children('li').length; // so we only have to run this once
  return len >= 4 && len <= 12;
};

One nice way is with a custom selector. Something like this:

$.expr[':'].hasmorethan4li = function(obj){
  return $(obj).children('li').length > 4;
};

Lets you do this:

$('ol:hasmorethan4li').makeacolumnlists(....);

Updated: As per the OP's question from the comments, here's a version of the selector for lists with between 4 and 12 items:

$.expr[':'].hasbetween4and12li = function(obj){
  var len = $(obj).children('li').length; // so we only have to run this once
  return len >= 4 && len <= 12;
};

回复收藏 0 原文

春风十里 2024-09-22 19:40:03

使用 $('li').size() 检查 li 的数量

回复收藏 0 原文

·深蓝 2024-09-22 19:40:03

如果想要

元素的length属性，则需要为单独获取每个

$('ol').each(function() {
    $(this).children('li').length;  // Gives you the number of <li>
                                    //    elements for the current <ol>
});

If you want the length property of <li> elements under a <ol>, you need to get it separately for each <ol>.

$('ol').each(function() {
    $(this).children('li').length;  // Gives you the number of <li>
                                    //    elements for the current <ol>
});

回复收藏 0 原文

~没有更多了~