Измерьте ширину () с помощью jQuery после обновления DOM - PullRequest
Новая
       9

Измерьте ширину () с помощью jQuery после обновления DOM

1 голос
/ 11 июня 2010

Мой сценарий динамически создает внутри <ul> ширину *1001* с плавающей точкой: это paginator.После этого скрипт измеряет ширину всех <li> с и суммирует их.

Проблема заключается в том, что после введения узлов в документ браузер обновляет DOM и применяет стили CSS, что занимает некоторое время.Это отрицательно сказывается на моем сценарии: когда эти операции не завершены до того, как я измерим ширину, мой сценарий получает неверное значение.Если я выполню измерение за секунду - все в порядке.

Я ищу способ определения момента, когда <ul> полностью прорисован, применены стили и стабилизирована ширина.Или, по крайней мере, способ обнаружить изменения каждого измерения.Конечно, я могу использовать setTimeout(..., 100), но это уродливо, и я предполагаю - не решение вообще.

Если есть способ обнаружить стабилизацию ширины - я бы сделал измерение сразу после этого, чтобы получить правильные значения.

HTML-код, сгенерированный DOM 

<div>
    <ul>
        <li><a href="...">1</a></li>
        <li><a href="...">2</a></li>
        ....
        </ul>
    </div>

PS Зачем мне это нужно. Слева * <li> элементы моего пагинатора имеют тенденцию кперейти к следующей строке, когда <ul> пытается стать шире, чем сама страница.Несмотря на то, что большинство <li> невидимы из-за ограничения ширины родительского <div>: 

div { width: 500px; overflow: hidden; }
div ul { width: 100%; white-space: nowrap; }
div ul li { display: block; float: left; }

они все равно будут уменьшаться, если я не укажу фактическую суммарную ширину <ul> с помощью скрипта.

1 Ответ

0 голосов
/ 11 июня 2010

Я обнаружил, что когда я встраиваю CSS в документ - все хорошо.Это доказывает, что проблема в том, что мои CSS-файлы не были загружены, несмотря на то, что я использовал $(document).ready() для инициализации.

Следует использовать $(window).load(), когда полагается на внешние ресурсы и желает правильно измерять ширину.

...