Динамически изменять / назначать экземпляр изменяемого размера пользовательского интерфейса на уже загруженных элементах DOM - PullRequest
Новая
       18

Динамически изменять / назначать экземпляр изменяемого размера пользовательского интерфейса на уже загруженных элементах DOM

2 голосов
/ 04 ноября 2011

Я пытаюсь динамически назначить другой экземпляр изменяемого размера jQuery-UI после загрузки DOM.

Я в основном хочу назначить фиксированное аспектное отношение true или false в зависимости от определенных факторов. Когда я запрашиваю новый экземпляр с изменяемыми размерами, он не обновляется.

Селекторы, используемые для назначения resizable (), также динамически создаются после загрузки DOM.

Вот упрощенный пример моего кода:

JQuery: 

$(document).ready( function() {

    $('.lyr').addClass('loose');
    $('.lyr2').addClass('fixed');

$('#change').bind( 'click', function() {

    if( $('.lyr, .lyr2').hasClass('loose') ) {

        $('.lyr, .lyr2').addClass('fixed').removeClass('loose');

        $('#status').html('changed to fixed');

        $('.lyr, .lyr2').resizable({
            aspectRatio: true,
            handles: 'all'
        });

    } else {

        $('.lyr, .lyr2').addClass('loose').removeClass('fixed');    

        $('#status').html('changed to loose');

        $('.lyr, .lyr2').addClass('fixed'); 

    }

});

});

HTML: 

<input type='button' id='change' value='change'>

<div id="canvas">
    <p>Resizable items</p>
    <div class='lyr'></div>
    <div class='lyr2'></div>

</div>

Вот пример работы: http://digitaloutback.co.uk/resizable-eg/ (нажмите «изменить», чтобы назначить исходный изменяемый размер)

Я также использовал плагин «live» и «livequery» вместо «bind», поэтому я не уверен, в чем причина проблемы ..

Нашли решение

Ответ был прямо передо мной в документации по jQuery UI:

изменяемого размера («уничтожить») перед переназначением. 

$('.lyr, .lyr2').resizable('destroy').resizable()..

1 Ответ

2 голосов
/ 08 ноября 2011

Ответ был прямо передо мной в документации по jQuery UI:

изменяемого размера («уничтожить») перед переназначением. 

$('.lyr, .lyr2').resizable('destroy').resizable()..
...