Question

我正在将UL从一个元素克隆到另一个元素。

    $( "#mobMenu li a" ).each(function(index) {

     var subID = $(this).attr('id') 

      if (typeof(subID) !== "undefined") {
          subID = "#sub_" + subID + " .subnav-menu"
           var subMenu = $(subID).clone();
           $(this).parent().append(subMenu);
    }
});

菜单我正在克隆：

<div id="sub_cat3">

 <ul id="sub_cat" class="subnav-menu">
   <li>..</li>
 </ul>

 <ul class="subnav-menu">
   <li>..</li>
 </ul>

</div>

进入一个如下所示的新手机菜单：

<ul id="mobMenu">
  <li><a id="cat3"></a>
 // cloned menu to go here
</li>
</ul>

那么我可以将每个克隆的ul组合成一个UL吗？

<ul class="subnav-menu">
<li>..</li>
<li>..</li>
</ul>

Answer 1

我想你想要这样的东西（不得不设计HTML作为一个合适的例子）：

JSFiddle： http://jsfiddle.net/TrueBlueAussie/b10n5mf0/1/

或使用新的HTML：http://jsfiddle.net/TrueBlueAussie/b10n5mf0/4/

$("#mobMenu li a").each(function (index) {
    var subID = $(this).attr('id')
    console.log(subID);
    if (subID) {
        subID = "#sub_" + subID + " .subnav-menu li"
        var $div = $('<ul>').append($(subID).clone());
        $(this).closest('li').append($div);
    }
});

备注：

它为每个匹配的列表LI创建单个UL。

仅克隆匹配的LI，然后在创建的UL下插入append。

if (typeof(subID) !== "undefined")可以替换为if (subID)，因为attr返回一个字符串或未定义（并且您的代码将空字符串视为未定义）。

Answer 2

你可以......

var $subs = $('.subnav-menu'),
    $lis = $subs.find('> li').clone();

// Add all the $lis to the first subnav...
$subs.eq(0).append($lis);

// Remove the rest of the subs...
$subs.slice(1).remove();

这是一个小型演示：http://jsbin.com/jerapo/2/edit?js,output

结合克隆的UL菜单

2 个答案: