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」重複的內容

回答

相關問題