Изменение размера JQuery UI на новые элементы не работает

0

Я пытаюсь изменить свой элемент диалога с помощью jQuery UI (последний). В моем документе была включена тема jquery css и последняя библиотека пользовательского интерфейса JQuery.

Но когда я создаю свой диалог HTML и вставляю его в свой документ, функция изменения размера не изменяет размер, отображается курсор изменения размера, а также отображается ручка изменения размера, но когда я ничего не перетаскиваю!

Когда я вставляю HTML-код для своего mannualy в свой документ и применяю плагин resizable() для этого диалога, функция resizable() работает!

но когда я вставляю HTML-код для своего диалога с

$('body').append($('<div id="dialog">some text</div>')); а затем выполните следующее:

$('#dialog').resizable();

ручка видна, но она не изменяет размер.

Кажется, resizable() плагин не работает для новых элементов в DOM?

Я потратил весь день на поиски решения :(

Кто-то знает, что происходит!

** РЕДАКТИРОВАТЬ **

Я нашел это!! плагин resizable() запускает событие "resize" для изменяемого размера элемента, и мой плагин имеет прослушиватель для этого события, я думал, что он был запущен только при изменении размера окна.

теперь мне нужно изменить свой плагин и выяснить, изменяется ли окно или его элемент. Спасибо всем, ребята!

2 ответа

0

Дайте элементу немного времени для рендеринга

    setTimeout(function(){
        $('#dialog').resizable();
    },500); 
  • 0
    Это, казалось, помогло мне. Установите время ожидания 2000, хотя. Это что-то вроде временного исправления. Я заметил такое поведение, когда 100% времени логика изменяемого размера работала, как ожидалось, во время отладки по всему коду. На следующий день я больше не отлаживал, но при использовании страницы элемент больше не показывался на странице. Это был хороший обходной путь для меня, по крайней мере.
0

вы должны использовать css jquery ui или сделать что-то вроде этого: вы можете работать без css файла, но вы должны поместить css в элемент div.

посмотрите этот код:

import css jquery ui:

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

Код js:

<script type="text/javascript">
$(document).ready(function(){
    $('body').append('<div id="dialog" style="border:1px solid black;height: 100px;left: 0;top: 0;width: 100px;">some text</div>');
    $('#dialog').resizable();
});
</script>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню