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

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

7 голосов
/ 10 ноября 2009

У меня есть две функции JS, одна из которых добавляет опции в поле выбора 

function addOption(selectId, text, value) {
    var selectbox = document.getElementById(selectId);
    var optNew = document.createElement('option');
    optNew.text = text;
    optNew.value = value;
    try {
        selectbox.add(optNew, null); //page position resets after this
    }
    catch(ex) {
        selectbox.add(optNew);
    }    
}

и другой, который выполняет document.getElementById (formId) .appendChild (newHiddenInput) в аналогично простой функции.

Они оба работают, элементы добавляются как положено. Однако при вызове любого из них страница сбрасывает свою позицию прокрутки в верхнюю часть страницы в IE6 и FF. Нет обратной передачи, это чисто клиентская манипуляция. Я установил точки останова в Firebug, и это происходит сразу после того, как будет выполнен element.appendChild или select.add. Я знаю, что могу использовать JS, чтобы вручную установить позицию прокрутки, но я не думал, что это необходимо, когда страница не перерисовывается.

Я не эксперт по JS или DOM, поэтому я вполне могу что-то упустить, но я посмотрел здесь и пробежался по их примерам с опциями Попробуй здесь, и я могу ' Я не могу повторить проблему, указав на то, что кодовая база, с которой я работаю, является виновником.

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

Ответы [ 2 ]

9 голосов
/ 10 ноября 2009

Если функции вызываются по ссылке, в вашей ссылке может быть внутренний якорь: 

http://www.website.com/page.html#

Это вызывает указанное поведение. Поведение по умолчанию состоит в том, что если привязка не существует, позиция прокрутки страницы переходит наверх (scrollTop = 0).

Если это происходит при каждом вызове функции независимо от источника, то это можно вычеркнуть из списка.

4 голосов
/ 10 ноября 2009

Что такое активация события?

Если это якорь, то в событии click вам нужно «вернуть false;» после вызова вашего кода jQuery / Ajax / jScript.

Если это кнопка, вам может потребоваться сделать то же самое.

У меня вчера был этот вопрос, и это было решение.

Итак <a href="#" onclick="DoStuff(); return false;">My link</a>

...