Выберите дочерний элемент для изменения размера jQuery, а также Resize

У меня есть элемент, размер которого я хочу изменить, и в то же время я должен изменить размер элемента под ним.

jQuery resizable предлагает эту функцию с опцией autoResize. Однако для этого требуется, чтобы вы предоставили селектор, такой как класс или идентификатор. Если я предоставлю класс, он изменит размер всех элементов на странице с этим классом. Я бы предпочел предоставить относительный селектор, такой как:

$(".panel").resizable({
  alsoResize: $(this).find(".panel-body")
});

Но ясно, что this — это не тот элемент .panel, на который я надеюсь. Возможно, это можно обойти, предоставив функцию resize, например:

$(".panel").resizable({
  resize: function(event, ui){ $(ui.element).find(".panel-body").css('width', $(ui.element).width() - (ui.originalSize.width - ui.element.width))}
});

Но это только кажется немного смешным. Какие-либо предложения?


jquery resizable
person TheJKFever    schedule 06.08.2015    source источник
comment
P.S. есть аналогичный вопрос, который не отвечает на мой вопрос как выбрать дочерний элемент для свойства alsoresize"> stackoverflow.com/questions/4813859/   -  person TheJKFever    schedule 06.08.2015

Ответы (2)


arrow_upward
0
arrow_downward

Я думаю, вы можете сделать так:

<div class="something"></div>

и в javascript вы можете найти это:

alsoResize: $(this).find(".something")

«Что-то» — это все, что вам нравится, вы не должны создавать это в CSS. со мной полезно

person Bùi Trần Thanh Đức    schedule 06.08.2015
comment
$(this) не будет работать внутри .resizable({}). find(.some-class) будет работать, но он изменит размер каждого класса на странице. - person TheJKFever; 06.08.2015
comment
Вы можете указать уникальный класс для этого элемента. Всякий раз, когда вы найдете этот класс, вы можете изменить его размер только - person Bùi Trần Thanh Đức; 06.08.2015
comment
Пожалуйста, прочитайте вопрос. Мне нужно обновить дочерний элемент объекта. Есть несколько таких объектов с детьми. Если я придумаю уникальный класс, то смогу сделать только один. - person TheJKFever; 06.08.2015

arrow_upward
0
arrow_downward

Вариант 1

Создайте переменную конкретного элемента, на который вы пытаетесь нацелиться. Если, например, вашей целью является <div id="targetDiv">, создайте переменную, используя следующий синтаксис:

var $resizeTarget = $('div#targetDiv');

Затем добавьте случайный класс к элементу, который будет использоваться только для этой конкретной цели (применять CSS не требуется, хотя рекомендуется установить для него background-color хотя бы для того, чтобы убедиться, что вы нацелены только на этот элемент.)

$resizeTarget.addClass('resizeTarget');

Оттуда вы можете выбрать этот элемент с помощью класса ИЛИ создать другую переменную, поскольку вы знаете, что она будет в глобальном пространстве имен.

var $resizeTargetFinal = $('div.resizeTarget');

Наконец, поместите эту вновь созданную переменную в функцию, которая автоматически изменяет размер.

$(".panel").resizable({ alsoResize: $resizeTargetFinal; });

Вариант 2

Используйте эту функцию, которую я создал по следующей ссылке, которая позволяет динамически изменять высоту при изменении размера. Скрипка динамической высоты

person Alexander Dixon    schedule 06.08.2015
comment
Хм, мне все еще нужно создать уникальный идентификатор с этим решением, или вариант 2 - создать свою собственную функцию. Все равно не отвечает на вопрос. - person TheJKFever; 06.08.2015
comment
В итоге я временно использовал пользовательскую функцию в функции изменения размера. Вот пример скрипта: jsfiddle.net/ojoevj1k/4 - person TheJKFever; 06.08.2015
comment
Это то, что я бы рекомендовал вам сделать. Нет причин, по которым при использовании других библиотек вы должны чувствовать, что вам нужно быть жестким в своем подходе, если указанная библиотека не из коробки делает то, что вам нужно. Есть множество способов добиться всего, чего вы хотите. Помимо того, что первоначальный автор взвешивает решение (которое они будут знать о внутренней работе более подробно), но это может быть только на его Github. - person Alexander Dixon; 06.08.2015
comment
Спасибо, Александр, я как бы надеялся, что может быть цикл, что я могу зацикливаться на своих элементах с изменяемым размером, и поскольку я в цикле, у меня есть доступ к нему внутри вызова с изменяемым размером. Или что-то умное в этом роде. - person TheJKFever; 06.08.2015