<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
當我點擊三個我希望它像: - 利用remove()
和prepend()
方法選擇元素,並使其第一要素
<ul>
<li>Three</li>
<li>One</li>
<li>Two</li>
<li>Four</li>
</ul>
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
當我點擊三個我希望它像: - 利用remove()
和prepend()
方法選擇元素,並使其第一要素
<ul>
<li>Three</li>
<li>One</li>
<li>Two</li>
<li>Four</li>
</ul>
手柄click事件。
$("body").on("click",'li',function(){
$('ul').prepend($(this));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
<li>four</li>
</ul>
爲什麼你需要一個循環,爲什麼你需要刪除? – madalinivascu
你也不需要 - 你可以直接附加/預先設置一個DOM對象,而不用擔心它被克隆,並且循環完全是多餘的 –
如果您有jQuery的你可以使用:
$('#items li').click(function() {
$(this).parent().prepend(this);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id = "items">
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
了,如果需要,我可以也寫了非jQuery的一個。
你可以試試這個
$('#list li').on('click', function() {
var index = $('li').index(this);
if (index !== 0) {
$(this).prependTo($(this).parent());
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
</head>
<body>
<form id="form1" runat="server">
<div>
<ul id="list" style="cursor: pointer;">
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
</div>
</form>
</body>
</html>
刪除和前置... – Rayon
請加上你的努力,到目前爲止的一些代碼,我們會幫你調試。 – ITWitch