jQuery“wrapAll”重复的内容

我有一个问题，wrapAll jQuery函数。我创建了一个Wordpress主题，我需要桌面上的菜单元素与他们在移动设备上稍有不同。长话短说，我需要将一些菜单项包装到一个div中。jQuery“wrapAll”重复的内容

因此，这里的HTML代码参与，之前，我打电话给我的jQuery函数（我自愿不包括上UL和李的父母为了简化问题）：

<li id="menu-item-124" class="sub__cat standalone el--right menu-item menu-item-type-post_type menu-item-object-page menu-item-124"><a href="http://foo.bar">Arbitrage</a></li> 
<li id="menu-item-132" class="sub__cat standalone el--right menu-item menu-item-type-post_type menu-item-object-page menu-item-132"><a href="http://foo.bar">Enseignement</a></li> 
<li id="menu-item-82" class="sub__cat last__right el--right no-href menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-82"><a href="#">Multimédia</a> 
    <ul class="sub-menu"> 
     <li id="menu-item-135" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-135"><a href="http://foo.bar">Photos &#038; vidéos</a></li> 
     <li id="menu-item-136" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-136"><a href="http://foo.bar">Téléchargements</a></li> 
    </ul> 
</li>

华我所做的是增加一个类（el - right）到我想要包装的每个菜单项。我检查是否elements__right div存在以避免多次创建它，然后我将所有el - 右项目包装为元素 - 右 div。

然后，我有这个功能（JQ是noConflict）至极被称为上的文件（准备好）：

function desktopMenu() { 

    if (jq(window).width() > 1365) { 

     if (jq('.elements__right').length > 0) { 

     } else { 

      jq('.el--right').wrapAll('<div class="elements__right"> </div>'); 

     } 
}

所以我婉结果如下：

<div class="elements__right"> 
    <li id="menu-item-124" class="sub__cat standalone el--right menu-item menu-item-type-post_type menu-item-object-page menu-item-124"><a href="http://foo.bar">Arbitrage</a></li> 
    <li id="menu-item-132" class="sub__cat standalone el--right menu-item menu-item-type-post_type menu-item-object-page menu-item-132"><a href="http://foo.bar">Enseignement</a></li> 
    <li id="menu-item-82" class="sub__cat last__right el--right no-href menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-82"><a href="#">Multimédia</a> 
     <ul class="sub-menu"> 
      <li id="menu-item-135" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-135"><a href="http://foo.bar">Photos &#038; vidéos</a></li> 
      <li id="menu-item-136" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-136"><a href="http://foo.bar">Téléchargements</a></li> 
     </ul> 
    </li> 
</div>

但内容被复制。奇怪的是，没有重复的菜单项ID：

<div class="elements__right"> 
    <li id="menu-item-124" class="sub__cat standalone el--right menu-item menu-item-type-post_type menu-item-object-page menu-item-124"><a href="http://foo.bar">Arbitrage</a></li> 
    <li id="menu-item-132" class="sub__cat standalone el--right menu-item menu-item-type-post_type menu-item-object-page menu-item-132"><a href="http://foo.bar">Enseignement</a></li> 
    <li id="menu-item-82" class="sub__cat last__right el--right no-href menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-82"><a href="#">Multimédia</a> 
     <ul class="sub-menu"> 
      <li id="menu-item-135" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-135"><a href="http://foo.bar">Photos &#038; vidéos</a></li> 
      <li id="menu-item-136" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-136"><a href="http://foo.bar">Téléchargements</a></li> 
     </ul> 
    </li> 
    <li class="sub__cat standalone el--right menu-item menu-item-type-post_type menu-item-object-page menu-item-124"><a href="http://foo.bar">Arbitrage</a></li> 
    <li class="sub__cat standalone el--right menu-item menu-item-type-post_type menu-item-object-page menu-item-132"><a href="http://foo.bar">Enseignement</a></li> 
    <li class="sub__cat last__right el--right no-href menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-82"><a href="#">Multimédia</a> 
     <ul class="sub-menu"> 
      <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-135"><a href="http://foo.bar">Photos &#038; vidéos</a></li> 
      <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-136"><a href="http://foo.bar">Téléchargements</a></li> 
     </ul> 
    </li> 
</div>

如果任何人有一个关于正在发生的事情的线索，我会非常感激。非常感谢！

来源

2017-06-15 Fl-0

我认为其他地方有相同的代码。 –

检查'jq（'。el - right'）length'的值' –

检查了你所建议的“el - right”元素的数量，以及由于某些原因宾果，有些藏在页脚中。我真的很惭愧，没有检查过它。反正非常感谢你！ –

与同某些代码“厄尔尼诺 - 右”类是在页脚躲藏，造成“抢夺”它的菜单，并包裹其他埃尔 - 右元素。

谢谢Pranav的平视。

来源

2017-06-15 15:49:01

它不会重复元素，但它会选择具有相同类的所有元素，因此请检查HTML的重复元素并根据需要处理它。

来源

2017-06-15 15:49:53

jQuery“wrapAll”重复的内容

回答

相关问题