полоса прокрутки сбрасывается при манипулировании DOM - PullRequest
Новая
       9

полоса прокрутки сбрасывается при манипулировании DOM

1 голос
/ 06 декабря 2011

Итак, у меня есть функция js, которая срабатывает при выборе опции из элемента <select>.Эта функция вызывает некоторые манипуляции с DOM <и по любой причине заставляет полосу прокрутки каждый раз подниматься вверх.Это расстраивает, потому что я переключил свои старые данные формы на ajax, чтобы избежать этой проблемы.</p>

Я исследовал эту проблему и обнаружил:

Как предотвратить сброс позиции прокрутки страницы после манипуляции с DOM?

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

Вот элемент формы, вызывающий функцию: 

<div id="imageTable">
   <form action="">
     <select onchange="getOption()" name="dir">
         <option value="Anotherguyly">Anotherguyly</option>
         <option value="Hello">Hello</option>
         <option value="page1">page1</option>
         <option value="pageish2">pageish2</option>
     </select>
   </form>
</div>

Вот функции js в шапке: 

        function getOption() {
            var selectDOM = document.getElementById("imageTable").getElementsByTagName("select")[0];
            var i = selectDOM.selectedIndex;
            var selectedChoices = selectDOM.options;
            var selectedText = selectedChoices[i].value
            resetImageTable(selectedText);
        }

        function resetImageTable(option) {
              // clears out previous DOM elements, inserts new chosen by the provided option
        }

1 Ответ

1 голос
/ 06 декабря 2011

Я подозреваю, что ответ находится в порядке исполнения.clears out previous DOM elements * очень может повлиять на эффективную позицию прокрутки.

Вместо того, чтобы удалять и затем добавлять узлы, рассмотрите возможность применения CSS visibility:hidden ко всем текущим изображениям, а затем поменяйте их местами.для вновь загруженных изображений.Если новых и старых меньше, удалите отставшие в конце вызова функции;если новых больше, чем старых, продолжайте добавлять их после замены.

Этот подход приведет к минимальному изменению положения прокрутки.

...