1

可能这是一个非常简单的问题,但我是 Jquery 的初学者......

我有以下脚本:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js">/script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.js">

    </script>

    <script>
         $(function() {

            $('li').draggable({
                containment: 'document',
                revert: true
            });


            $("#config").droppable({
                drop: function(event, ui) {
                $(ui.draggable).appendTo( "#schub" );
                }
            });

        });


    </script>

这就是我的身体所包含的:

    <div style="width:1800px; height:600px; background-color:#efefef;padding:10px;" >
    <div style="float:left; width:1250px; height:580px; border:1px solid grey; padding:10px;" >
        <div id="config" style="background-color:blue; border:1px solid black; width:700px; height:500px;">

            <ul id="schub" style="width:300px;  height:500px;"></ul>

        </div>
    </div>

<div style=" background-color:red;float:left; width:490px; height:580px; border:1px solid grey; margin-left:10px;padding:10px;" id="menu">
    <ul class="category">

        <li  class="dragg"  style="background-color:#e6e6e6; border:1px solid black; width:150px; height:98px;">
        </li>

        <li class="dragg" style="background-color:#e6e6e6; border:1px solid black; width:150px; height:98px;">
        </li>

        <li  class="dragg"  style="background-color:#e6e6e6; border:1px solid black; width:150px; height:98px;">
        </li>

    </ul>

</div>

现在我的问题:我希望能够将灰色<li>从红色<div>拖到蓝色<div>。它确实有效,但是当我放下它们时,灰色<li>总是从窗口外部恢复为蓝色。<div>为什么会这样??难道我<li>不能从我放下它们的地方恢复吗?

非常感谢您的帮助!

4

1 回答 1

1

我想我找到了解决方案:

问题是,在蓝色 div 中使用他在附加 ge 之前的 css 样式<li>附加到新的 div 中。<ul>

放入<li>new后<ul id="schub">,它仍然有来自 Jquery 的 css,大约是 left:-1000px; (因为我们<li>从右向左拖动)。然后它被附加到新的ul。浏览器认为with left:-1000px;的<li>is en 元素 <ul id="schub">这是窗外。定义恢复:真;设置在 上,<li>因此它从窗口外部恢复到<ul id="schub">.

我实际上没有找到解决方案,而是一种解决方法:

我们可以将定义助手:'clone' 添加到<li>. 像这样,我们得到了原版的克隆。它实际上并没有从我们删除它的点恢复,而是它被附加到新的<ul>而不从窗口外部恢复。

于 2012-04-14T13:45:14.430 回答