Получить ширину элемента после изменения его размера

Question

Можно ли получить размер элемента после изменения его размера с помощью $ (el) .css ()?

Мой код:

function resize() {
    $(".combobox").css('width', '100%');
    var width = $(".combobox").width();
}

Реальное значение комбобокса я получаю только после повторного вызова функции. Первый раз получает ширину перед выполнением $ (". Combobox"). Css ('width', '100%');

Полагаю, это вина того, что DOM не воссоздается после .css (). Есть ли способ принудительной перезагрузки DOM?

Заранее спасибо!

Answer 1

Попробуйте поместить часть кода, которая получает ширину в таймере, запланированную на 1 миллисекунду ...

Браузер не будет выполнять вычисления изменения размера во время выполнения скрипта. Если вы запланируете таймер и выйдете из функции JS, браузер обновит состояние всех элементов DOM, которые изменились, а затем запустит таймер, поэтому к этому времени ширина вашего комбинированного списка обновится.

Я использовал нечто очень похожее на веб-странице, основанной на GWT

Этот трюк работает не только для JS, но и во многих средах с графическим интерфейсом, которые делают макет с задержкой.

Answer 2

Попробуйте соединить две функции:

function resize() {
    var width = $(".combobox").css('width', '100%').width();
}