jquery每个问题

我想用jQuery制作一个动态列表。我所拥有的是一个ul元素，其中包含一个链接和一个子元素ul。就像这样：jquery每个问题

<div id="new_list"></div> 
<ul id="old_list" class="listview"> 
    <li> 
     <a class="list" href="#">List I</a> 
     <ul class="sub"> 
     <li>1</li> 
     <li>2</li> 
     </ul> 
    </li> 
    <li> 
     <a class="list" href="#">List II</a> 
     <ul class="sub"> 
     <li>1</li> 
     <li>2</li> 
     </ul> 
    </li> 
</ul>

什么，我想这个名单做的是：

当用户点击这些链接，子ul元素的HTML（这是刚才点击链接的兄弟姐妹）应该被复制到new_list div然后变得可见。下面是代码：

$("a.list").each(function() { 
    $(this).click(function() { 
     var listToShow = $(this).siblings("ul"); 
     $("#new_list").html(listToShow); 
     $("#old_list").hide(); 
     $("#new_list").show(); 
     return false; 
    }); 
});

此代码适用于首次的所有链接，但是当我点击相同的链接再次空单出现。

我在想什么？

谢谢。

来源

2011-04-15 keune

我不认为'each（）'是必须的。 – Blender 2011-04-15 20:10:56

当您在html中使用DOM元素或jQuery选择时，元素将从之前的位置移除并移至DOM中的新位置。

如果你想将它们复制到的位置，你需要使用.clone：

var listToShow = $(this).siblings("ul").clone();

还要注意的是，你不需要each电话有：处理程序在自动应用到每一个元素选择。

$("a.list").click(function() { 
    var listToShow = $(this).siblings("ul").clone(); 
    $("#new_list").html(listToShow); 
    $("#old_list").hide(); 
    $("#new_list").show(); 
    return false; 
});

来源

2011-04-15 20:10:50 lonesomeday

无论何时您调用jQuery选择器，对其执行的操作都会影响选择器返回的全部对象。尝试这个。这将绑定功能与类list所有当前和未来<a>锚标记，而无需使用each();

$('a.list').live('click', function() { 
    var listToShow = $(this).siblings("ul"); 
    $("#new_list").html(listToShow); 
    $("#old_list").hide(); 
    $("#new_list").show(); 
    return false; 
});

查阅这些链接的一些教育上的主题

http://api.jquery.com/click/

http://api.jquery.com/bind/

http://api.jquery.com/live/

来源

2011-04-15 20:09:32 Dutchie432

尝试类似这样的东西。希望这可以帮助。

$('#old_list').delegate('a.list', 'click', function() { 
    $(this).siblings('ul.sub').clone().appendTo('#new_list'); 
});

删除.clone（）如果你想动它而不是复制它。

来源

2011-04-15 20:12:35

jquery每个问题

回答

相关问题