@Misha5
профессиональный бомж

Как сохранить размеры растягиваемого элемента (JQuery UI)?

У меня на странице есть элементы drag and drop, которые сохраняют свое положение в пространстве. Теперь я хочу, чтобы они сохраняли размеры при растягивании в ширину и высоту.
Использую JQuery UI.
1 попытка была такая (сохранять размеры блока после изменения и добавлять в стили элемента)
$( ".resizable_content" ).resizable({
	handles: "se",
	stop: function(evet, ui) {
		let resElem = document.getElementById(this.id);
		var w = ui.size.width;
		var h = ui.size.height;
		console.log(w, h);
		resElem.style.height = h;
		resElem.style.width = w;
	},
});

Не сработало, не знаю почему.

2 вариант: сохранять размеры в localStorage:
var sHeight = localStorage.height || "{}",
	sWidth = localStorage.width || "{}",
	height = JSON.parse(sHeight),
	width = JSON.parse(sWidth);
$.each(height, function (id, height) {
	$("#" + id).css(height)
})
$.each(width, function (id, width) {
	$("#" + id).css(width)
})
$(".resizable_content" ).resizable({
	handles: "se",
	stop: function (event, ui) {
		height[this.id] = ui.size.height
		width[this.id] = ui.size.width
		localStorage.height = JSON.stringify(height)
		localStorage.width = JSON.stringify(width)
	}
});

Тут мне начала прилетать ошибка TypeError: a.replace it not a function, которая, как оказалось, вылетает из-за $.each().
  • Вопрос задан
  • 32 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы