Сортируемый пользовательский интерфейс jQuery - запрещает передачу в дочерние элементы
-
08-07-2019 - |
Вопрос
Я работаю с сортировками пользовательского интерфейса jQuery и создал систему divs в этом формате;
<div class='mainDiv'>
<label>text: <input type='text' name='textbox' /></label>
<div class='children'>
<div class='mainDiv'>...</div>
<div class='mainDiv'>...</div>
<div class='mainDiv'>
<label>text: <input type='text' name='textbox' /></label>
<div class='children'>...</div>
</div>
</div>
</div>
У divs может быть бесконечное количество дочерних элементов, и я хочу иметь возможность перетаскивать все .mainDiv в их родительское поле, поэтому я использовал это:
$(".mainDiv").parent().sortable({items: ".mainDiv", containment: "parent"});
Однако это позволяет перетаскивать элементы в их дочерние или родственные .дочерние подразделения.чего я не хочу, чтобы произошло.Я хочу ограничить пребывание элементов в пределах их родительского элемента.
Любая помощь здесь была бы очень кстати.
Ваше здоровье
Решение
Мне удалось решить это следующим образом:
$(this).parent().sortable({
items: '> li',
axis: 'y',
...
});
В вашем случае это должно работать с:
items: '> .mainDiv'
сдерживание:"родитель" не требуется.
В моем случае я включаю "сортируемый" во время предыдущего события клика, так как это быстрее.Я думаю, будет проще, если вы привяжете его к событию "наведение курсора мыши".Если вы создаете дерево динамически (например, Ajax), я рекомендую вам использовать "livequery".