如何拖动包含拖入其中的其他div的div?

时间:2012-12-19 21:39:51

标签: jquery html drag-and-drop

我正在努力解决一个问题,而且我自己也没有多少运气。

我的页面上有几个容器div。 “ItemContainer”包含可拖动的“项目”。 “MainHome”包含一个辅助“ItemContainer”(其中“items”将被拖动到)以及其他一些div。 “MainHome”也可以拖入“Playarea”。我需要发生的是,当“items”被拖入“MainHome”中包含的“ItemContainer”时,需要将它们附加到它上面,这样如果拖动“MainHome”,那些项就会随之拖动。

他们也需要保持个人可拖动。

这是我的通用代码:

<div id="leftrail">
    <div id="manager">
        <div id="somediv">
            <h2>Text</h2>
            <div id="bubble">Text Here</div>
        </div>
        <div>
            <div id="ItemContainer">
                <div id="Item1">Item 1</div>
                <div id="Item2">Item 2</div>
                <div id="Item3">Item 3</div>
                <div id="Item4">Item 4</div>
                <div id="Item5">Item 5</div>
            </div>
        </div>
    </div>
    <h2>Section Title</h2>
    <div>
        <div id="MyContainer">
            <div id="SecondaryItemContainer">Drag Items Here</div>
            <div>Some text</div>
            <div>Some more text</div>
        </div>
    </div>
</div>

<div id="MainContent">    
    <div>Some stuff here</div>    
    <div>Some stuff here</div>      
    <div>Some stuff here</div>    
    <div id="BigContainer">Drag the MyContainer Here</div>      
</div>

此处的完整演示:http://jsfiddle.net/j6pVG/1/

1 个答案:

答案 0 :(得分:0)