JQuery выпадающая проблема - PullRequest
Новая
       11

JQuery выпадающая проблема

1 голос
/ 21 декабря 2011

Я написал код jQuery, который позволяет пользователю создавать 2 поля на экране, а затем перетаскивать одно в другое. С точки зрения HTML это выглядело бы так ... 

<div id="1">
    <div id="2">
    </div>
</div>

Если я затем создаю другой блок и перетаскиваю его на блок 2, а затем опускаю, он всегда помещается в блок 1 (т.е. родительский блок блока 2). То, что я хочу, это ... 

<div id="1">
    <div id="2">
        <div id="3">
        </div>
    </div>
</div>

... но что я получаю, это ... 

<div id="1">
    <div id="2">
    </div>
    <div id="3">
    </div>
</div>

Вы [ИСПОЛЬЗУЛИ, ЧТОБЫ УБИТЬ] можете увидеть это здесь ... http://acarna.com/editor.php <- я исправил проблему ... см. Мой ответ ниже </p>

Нажмите кнопку "H" в левом верхнем углу, чтобы создать поле. Возьмите серый квадрат в верхнем правом углу окна, чтобы перетащить его вниз на страницу. Наведите указатель мыши на край или угол окна и измените его размер.

Затем снова нажмите «H», чтобы создать блок 2. Перетащите блок 2 в блок 1. Это работает правильно. Если вы используете Firefox, вы можете видеть окно, как оно добавлено в поле 1 при наведении мыши.

Проблема, с которой я столкнулся, заключается в создании блока 3, перемещении его над блоком 2 и попытке поместить его внутрь. Он обнаруживает только поле 1 и сбрасывает его.

Есть ли у меня какая-то хитрость, чтобы jQuery определял блок 2, когда блок 3 перетаскивали поверх него, и вместо этого добавляли его туда?

1 Ответ

1 голос
/ 23 декабря 2011

У меня только что был момент ясности после борьбы с редкой документацией jQuery UI (ahem).

Опускаемый параметр 'жадный' определяет, где приземлится объект, когда он упадет на дерево объектов, которые могут быть сброшены.

Если установлено значение false (по умолчанию), отброшенный объект приземлится на самый нижний объект в дереве.Если задано значение true, упавший объект приземлится на первый (т. Е. Самый высокий) объект, который может быть сброшен в дереве.

Это можно продемонстрировать, используя следующую разметку в качестве примера.Представьте, что следующие div - это все объекты, которые можно сбрасывать ... 

<div id="bottom_container">
    <div id="level_2_container">
        <div id="level_3_container">
        </div>
    </div>
</div>

Перетаскиваемый объект (указанный ниже id = "all_new_container") отбрасывается на div # level_3_container.Вот разметка, которая получается, если жадность равна false (т. Е. По умолчанию) ... 

<div id="bottom_container">
    <div id="level_2_container">
        <div id="level_3_container">
        </div>
    </div>
    <div id="all_new_container">
    </div>
</div>

А вот разметка, которая получается, если жадность установлена ​​в значение true ... 

<div id="bottom_container">
    <div id="level_2_container">
        <div id="level_3_container">
            <div id="all_new_container">
            </div>
        </div>
    </div>
</div>

Если у вас есть Firebug, вы наблюдаете, как это происходит, когда вы перетаскиваете объекты в другие объекты здесь ... http://acarna.com/editor.php

Пожалуйста, извините за ошибку позиционирования, из-за которой новые выпавшие элементы приземляются в неправильном месте за пределами уровня 2. Я выигралне исправить это в приведенном выше примере, и это не обязательно делать для вышеприведенной демонстрации.

...