dhage.prashant01 Ответов: 2

как закрепить выносной элемент в jQuery


Здравствуйте друзья,
Просто пройдите через следующий код

<html>
    <head>
        <script src="../Script/jquery-1.7.1.min.js"></script>
    </head>
    <body>
        <div>
            <ul class="menu">
                <li>A</li>
                <li>B</li>
                <li class="detach">C</li>
                <li>D</li>
                <li class="attach">E</li>
            </ul>
            <button>Detach</button>
            <button class="btnAttach">Attach</button>
        </div>
        <script>
            $(document).ready(function(){
                $("button").click(function(){
                    $holder = $(".detach").detach();
                    });
                $(".btnAttach").click(function(){
                    alert($holder);
                    $(".menu").children().last().after($holder);
                    });
                });
        </script>
    </body>
</html>


Вот что я пытаюсь сделать
1. I'm detaching element C<br />
2. I'm attaching C after element E


Отсоединение происходит правильно, но прикрепление не работает

Можете ли вы сказать, где я ошибаюсь??

Заранее спасибо

2 Ответов

Рейтинг:
2

Not Active

Попробуй

$(".menu").append($holder);

Предполагая, что $holder действителен, конечно.

Если вы перемещаете элементы динамически, вы можете рассмотреть пользовательский интерфейс JQuery Сортируемый[^] виджет.


Рейтинг:
2

nenadbulatovic

<!DOCTYPE html>
<html>
<head>
    <script src="scripts/jquery-1.6.2.min.js"></script>
</head>
<body>
<div>
    <ul class="menu">
        <li>A</li>
        <li>B</li>
        <li class="detach">C</li>
        <li>D</li>
        <li>E</li>
    </ul>
    <button class="btnDetach">Detach</button>
    <button class="btnAttach">Attach</button>
</div>
<script>
    $(document).ready(function(){
        $(".btnDetach").click(function(){
            $holder = $(".detach").detach();
        });
        $(".btnAttach").click(function(){
            $(".menu").append($holder);
        });
    });
</script>
</body>
</html>