jQuery.wrapAll（）问题_Jquery_Expressionengine

jQuery.wrapAll（）问题

jquery

jQuery.wrapAll（）问题,jquery,expressionengine,Jquery,Expressionengine,我使用CMS输出列表项，然后使用.wrapAll（）根据列表项的类将列表项包装到ul中。这基本上是对它们进行分组，因为我不能用我的CMS在服务器端进行分组但它将具有相同类的列表项包装到一个无序列表中。我怎样才能避开这件事 jQuery $('.week_7').wrapAll('<ul class="devotionals"/>'); $('.week_6').wrapAll('<ul class="devotionals"/>'); $('.week_5').wrap

我使用CMS输出列表项，然后使用.wrapAll（）根据列表项的类将列表项包装到ul中。这基本上是对它们进行分组，因为我不能用我的CMS在服务器端进行分组

但它将具有相同类的列表项包装到一个无序列表中。我怎样才能避开这件事

jQuery

$('.week_7').wrapAll('<ul class="devotionals"/>');
$('.week_6').wrapAll('<ul class="devotionals"/>');
$('.week_5').wrapAll('<ul class="devotionals"/>');
$('.week_4').wrapAll('<ul class="devotionals"/>');
$('.week_3').wrapAll('<ul class="devotionals"/>');
$('.week_2').wrapAll('<ul class="devotionals"/>');
$('.week_1').wrapAll('<ul class="devotionals"/>');

$（'.week_7'）.wrapAll（'）；
$（'week_6'）.wrapAll（'ul class=“deficationals”/>）；
$（'week_5'）.wrapAll（'ul class=“deficationals”/>）；
$（'week_4'）.wrapAll（'ul class=“deficationals”/>）；
$（'week_3'）.wrapAll（'ul class=“deficationals”/>）；
$（'week_2'）.wrapAll（'ul class=“奉献者”/>）；
$（'week_1'）.wrapAll（'ul class=“deficationals”/>）；

HTML:在jQuery之前

<li class="week_1">Day 1</li>
<li class="week_1">Day 2</li>
<li class="week_1">Day 3</li>
<li class="week_1">Day 4</li>
<li class="week_1">Day 5</li>
<li class="week_2">Day 1</li>
<li class="week_2">Day 2</li>
<li class="week_2">Day 3</li>
<li class="week_2">Day 4</li>
<li class="week_2">Day 5</li>

<section class="series">
    <h1>June</h1>
    <li class="week_1">Day 1</li>
    <li class="week_1">Day 2</li>
    <li class="week_1">Day 3</li>
    <li class="week_1">Day 4</li>
    <li class="week_1">Day 5</li>
    <li class="week_2">Day 1</li>
    <li class="week_2">Day 2</li>
    <li class="week_2">Day 3</li>
    <li class="week_2">Day 4</li>
    <li class="week_2">Day 5</li>
</section>
<section class="series">
    <h1>July</h1>
    <li class="week_1">Day 1</li>
    <li class="week_1">Day 2</li>
    <li class="week_1">Day 3</li>
    <li class="week_1">Day 4</li>
    <li class="week_1">Day 5</li>
    <li class="week_2">Day 1</li>
    <li class="week_2">Day 2</li>
    <li class="week_2">Day 3</li>
    <li class="week_2">Day 4</li>
    <li class="week_2">Day 5</li>
</section>

第一天第2天第3天第4天第5天第1天第2天第3天第4天第5天这将继续列出第3周到第7周的项目

HTML：在jQuery之后

<ul>
    <li class="week_1">Day 1</li>
    <li class="week_1">Day 2</li>
    <li class="week_1">Day 3</li>
    <li class="week_1">Day 4</li>
    <li class="week_1">Day 5</li>
    <li class="week_1">Day 1</li>
    <li class="week_1">Day 2</li>
    <li class="week_1">Day 3</li>
    <li class="week_1">Day 4</li>
    <li class="week_1">Day 5</li>
    <li class="week_2">Day 1</li>
    <li class="week_2">Day 2</li>
    <li class="week_2">Day 3</li>
    <li class="week_2">Day 4</li>
    <li class="week_2">Day 5</li>
    <li class="week_2">Day 1</li>
    <li class="week_2">Day 2</li>
    <li class="week_2">Day 3</li>
    <li class="week_2">Day 4</li>
    <li class="week_2">Day 5</li>
</ul>


第一天
第2天
第3天
第4天
第5天
第一天
第2天
第3天
第4天
第5天
第1天
第2天
第3天
第4天
第5天
第1天
第2天
第3天
第4天
第5天

HTML：它应该如何呈现

<ul>
    <li class="week_1">Day 1</li>
    <li class="week_1">Day 2</li>
    <li class="week_1">Day 3</li>
    <li class="week_1">Day 4</li>
    <li class="week_1">Day 5</li>
    <li class="week_2">Day 1</li>
    <li class="week_2">Day 2</li>
    <li class="week_2">Day 3</li>
    <li class="week_2">Day 4</li>
    <li class="week_2">Day 5</li>
</ul>
<ul>
    <li class="week_1">Day 1</li>
    <li class="week_1">Day 2</li>
    <li class="week_1">Day 3</li>
    <li class="week_1">Day 4</li>
    <li class="week_1">Day 5</li>
    <li class="week_2">Day 1</li>
    <li class="week_2">Day 2</li>
    <li class="week_2">Day 3</li>
    <li class="week_2">Day 4</li>
    <li class="week_2">Day 5</li>
</ul>


第一天
第2天
第3天
第4天
第5天
第1天
第2天
第3天
第4天
第5天


第一天
第2天
第3天
第4天
第5天
第1天
第2天
第3天
第4天
第5天

编辑这基本上就是HTML中的内容

在jQuery之前

<li class="week_1">Day 1</li>
<li class="week_1">Day 2</li>
<li class="week_1">Day 3</li>
<li class="week_1">Day 4</li>
<li class="week_1">Day 5</li>
<li class="week_2">Day 1</li>
<li class="week_2">Day 2</li>
<li class="week_2">Day 3</li>
<li class="week_2">Day 4</li>
<li class="week_2">Day 5</li>

<section class="series">
    <h1>June</h1>
    <li class="week_1">Day 1</li>
    <li class="week_1">Day 2</li>
    <li class="week_1">Day 3</li>
    <li class="week_1">Day 4</li>
    <li class="week_1">Day 5</li>
    <li class="week_2">Day 1</li>
    <li class="week_2">Day 2</li>
    <li class="week_2">Day 3</li>
    <li class="week_2">Day 4</li>
    <li class="week_2">Day 5</li>
</section>
<section class="series">
    <h1>July</h1>
    <li class="week_1">Day 1</li>
    <li class="week_1">Day 2</li>
    <li class="week_1">Day 3</li>
    <li class="week_1">Day 4</li>
    <li class="week_1">Day 5</li>
    <li class="week_2">Day 1</li>
    <li class="week_2">Day 2</li>
    <li class="week_2">Day 3</li>
    <li class="week_2">Day 4</li>
    <li class="week_2">Day 5</li>
</section>


六月
第一天
第2天
第3天
第4天
第5天
第1天
第2天
第3天
第4天
第5天
七月
第一天
第2天
第3天
第4天
第5天
第1天
第2天
第3天
第4天
第5天

在jQuery之后

<section class="series">
    <h1>June</h1>
    <ul class="devotionals">
        <li class="week_1">Day 1</li>
        <li class="week_1">Day 2</li>
        <li class="week_1">Day 3</li>
        <li class="week_1">Day 4</li>
        <li class="week_1">Day 5</li>
        <li class="week_1">Day 1</li> <!-- July Week 1 -->
        <li class="week_1">Day 2</li>
        <li class="week_1">Day 3</li>
        <li class="week_1">Day 4</li>
        <li class="week_1">Day 5</li>
        <li class="week_2">Day 1</li>
        <li class="week_2">Day 2</li>
        <li class="week_2">Day 3</li>
        <li class="week_2">Day 4</li>
        <li class="week_2">Day 5</li>
        <li class="week_2">Day 1</li> <!-- July Week 2 -->
        <li class="week_2">Day 2</li>
        <li class="week_2">Day 3</li>
        <li class="week_2">Day 4</li>
        <li class="week_2">Day 5</li>
    </ul>
</section>
<section class="series">
    <h1>July</h1>

</section>


六月

第一天
第2天
第3天
第4天
第5天
第一天
第2天
第3天
第4天
第5天
第1天
第2天
第3天
第4天
第5天
第1天
第2天
第3天
第4天
第5天

七月

选择每个课程中尚未包装在“奉献者”课程中的前五个，然后包装这些课程。然后重复，直到没有剩余的未包装的。这是您运行的选择器，直到所有内容都打包：

$('.week_1:not(.devotionals > li):lt(5), .week_2:not(.devotionals > li):lt(5),
   .week_3:not(.devotionals > li):lt(5), .week_4:not(.devotionals > li):lt(5), 
   .week_5:not(.devotionals > li):lt(5), .week_6:not(.devotionals > li):lt(5), 
   .week_7:not(.devotionals > li):lt(5)').wrapAll('<ul class="devotionals"/>');

$（'.week_1:not（.indivationals>li）：lt（5），.week_2:not（.indivationals>li）：lt（5），
.第三周：不（.indivationals>li）：lt（5），.第四周：不（.indivationals>li）：lt（5），
.第五周：不（.indivationals>li）：lt（5），.第六周：不（.indivationals>li）：lt（5），
.第7周：非（.indivationals>li）：lt（5）..wrapAll（'ul class=“indivationals”/>）；

让它干一点：

var week_not_wrapped = '.week_X:not(.devotionals > li):lt(5)';
var weeks_not_wrapped = [];

for (var i = 1; i <= 7; ++i) 
{
  weeks_not_wrapped.push(week_not_wrapped.replace('X', i));
}

weeks_not_wrapped = weeks_not_wrapped.join(',');

do { $(weeks_not_wrapped).wrapAll('<ul class="devotionals"/>'); }
while($(weeks_not_wrapped).length > 0);

var week_not_wrapped=”。week_X:not（.indivationals>li）：lt（5）；
var weeks_not_wrapped=[]；
对于（VarI=1；I0）；

…并将其进一步缩小：

var weeks_not_wrapped = $.map([1, 2, 3, 4, 5, 6, 7], function(elem) {
  return '.week_' + elem + ':not(.devotionals > li):lt(5)';
}).join(',');

do { $(weeks_not_wrapped).wrapAll('<ul class="devotionals"/>'); } 
while($(weeks_not_wrapped).length > 0);

var weeks\u not\u wrapped=$.map（[1,2,3,4,5,6,7]，函数（elem）{
return'.week.'+elem+'：not（.indivationals>li）：lt（5）'；
})。加入（‘，’）；
不要{$（未包装的周）.wrapAll（'ul class=“deficationals”/>）；}
而（$（未包装的周）。长度>0）；

我想你想要这样的东西

$(function(){
    $('li.week_1').not('ul li').wrapAll('<ul class="devotionals"/>');
    $('.week_2').not('ul li').wrapAll('<ul class="devotionals"/>');
});

如果要在这些

li

s上添加任何事件处理程序，请使用类似以下内容（委托）

，这也是我的一个问题，为什么你不能从服务器端这样做，如果你可以动态生成

li

s，那么你也可以以某种方式生成

ul

s。你发布的“应该如何呈现”代码真的是你的目标吗？我看不到“class=”deficationals”位，您列出列表的方式也与您上面描述的不一样…@RecoveringSince2003您的工作正常，尽管您只在类中包装列表项一次。jQuery.wrapAll（）；是普利吗